www.webdeveloper.com
Results 1 to 6 of 6

Thread: [RESOLVED] Styled Forms & FireFox

  1. #1
    Join Date
    Oct 2006
    Location
    California, USA
    Posts
    121

    resolved [RESOLVED] Styled Forms & FireFox

    The Styled Forms in Firefox are being pushed down.

    Click here for screenshot comparison

    Any ideas on a fix?

    The CSS for the form is:
    Code:
    .login {
    	border: 1px solid #bdc1a3;
    	background: url(img/input_box.gif) repeat-x;
    	height: 11px;
    	length: 50px;
    	width: 50px;
    	color: #990000;
    	font-size: 9px;
    }

  2. #2
    Join Date
    Nov 2003
    Location
    Jerryville, Tejas
    Posts
    11,715
    Do you have vertical-align:middle on the inputs?
    "Debugging is twice as hard as writing the code in the first place. Therefore, if you write the code as cleverly as possible, you are, by definition, not smart enough to debug it." Brian W. Kernighan

  3. #3
    Join Date
    Oct 2006
    Location
    California, USA
    Posts
    121
    Yes, and it has no effect with or without in FireFox...

  4. #4
    Join Date
    Oct 2006
    Location
    California, USA
    Posts
    121
    Does this not happen normally? Click for Live Demo

  5. #5
    Join Date
    Nov 2003
    Location
    Jerryville, Tejas
    Posts
    11,715
    The form needs a div to be valid:
    HTML Code:
    <form class="log">
    <div>
    <img src="img/user.gif"/>
    <input class="login" type="text" name="username"/>
    <img src="img/pass.gif"/>
    <input class="login" type="password" name="pass"/>
    </div>
    </form>
    And the imgs need to be vertical-align:middle, not vertical-align:bottom as you have them now.
    "Debugging is twice as hard as writing the code in the first place. Therefore, if you write the code as cleverly as possible, you are, by definition, not smart enough to debug it." Brian W. Kernighan

  6. #6
    Join Date
    Oct 2006
    Location
    California, USA
    Posts
    121
    The <div> fixed the problem...must have skipped over that. ;( Thanks for your help

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles