Hello and welcome to our community! Is this your first visit?
Register
Enjoy an ad free experience by logging in. Not a member yet? Register.
Results 1 to 2 of 2

Thread: css overlaying

  1. #1
    Regular Coder
    Join Date
    Jun 2010
    Location
    Earth
    Posts
    305
    Thanks
    27
    Thanked 2 Times in 2 Posts

    css overlaying

    I want to have the words "case sensitive" in my text boxes on a login form. Unfortunately with the password being secured you cannot read it so I am trynig to see if there is anyother way to do this?

    Below is what I want it to look like. Currently when you type in the boxes it puts the type behind the words, I want them in front. Can this be done??

    Code:
    <!DOCTYPE html PUBLIC '-//W3C//DTD XHTML 1.0 Strict//EN' 'http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd'>
    <html xmlns='http://www.w3.org/1999/xhtml'>
    <head>
     <style type="text/css">
      #caseOver{
       position: absolute;
       top: 12px;
       left: 100px;
       font-size: 14px;
       color: #CFCDB7;
       width: 150px;
       letter-spacing: 0.05em;
      }
      
      #caseOverPswd {
       position: absolute;
       top: 52px;
       left: 100px;
       font-size: 14px;
       color: #CFCDB7;
       width: 150px;
       letter-spacing: 0.07em;
      }
        
      #loginForm {
       position: absolute;
       top: 15px;
       left: 70px;
      }
       #loginForm .textbox {
       font-size: 13px;
       line-height: 3em;
       letter-spacing: 0.1em; 
      }
       #loginForm .cells {
       background: #F1F1E3;
       border: 1px solid #CFCDB7;
       font-size: 13px;
      }
     </style>
     <div id='loginForm'>
      <div id='caseOver'>case sensitive</div>  
      <div id='caseOverPswd'>case sensitive</div>       
      <form method='post' action='' name='login' id='theFormID'>
       <span class='textbox'> 
        <label for='username'>Username: </label> <input type='text' name='clientID' id='theFieldID' size='25'  class='cells'>
        <br><label for='pswd'>Password: </label> <input type='password' name='pswd' size='25' class='cells'>
        <br><input type='submit' value='Login'>
       </span>
      </form>
      <script type="text/javascript">theFormID.theFieldID.focus();</script>
    Last edited by harkly; 08-28-2012 at 06:42 PM.

  • #2
    Regular Coder
    Join Date
    Jun 2010
    Location
    Earth
    Posts
    305
    Thanks
    27
    Thanked 2 Times in 2 Posts
    figured it out!

    border: none;
    background-color: transparent;


  •  

    Posting Permissions

    • You may not post new threads
    • You may not post replies
    • You may not post attachments
    • You may not edit your posts
    •