PDA

View Full Version : IE7 CSS Forms



lesmith
Aug 23rd, 2007, 10:41 PM
Hello Peeps

I am creating a new template simple template and I am getting a little annoye with IE7.

In my CSS I have stated the background / border & text colors. working perfect in Firefox but in IE7 the second first text box oes not render the correct colors.

Here is the code.


/*********** Forms ****************/
form{ margin:0; padding:0; font-size:11px;}
input{ background:#5d5d5d; border:1px solid #666666; color:#bababa;}
.topinput{ width:100px;}
.inputbutton{ border:0;}


And the simple form.



<form action="#" method="post">
<input type="text" id="123" email" value="Email" class="topinput"/><br>
<input type="password" id="456" name="password" value="Password" class="topinput"/><br>
<input type="image" src="/img/login.gif" name="clsubmit" class="inputbutton" /><br>
</form>


And here is a picture of what is happening.

http://poukie.site-proof.co.uk/img/example.gif

Is this a IE7 bug.

Hope you can advise.

Ta

twodayslate
Aug 23rd, 2007, 11:52 PM
.topinput {background-color: #5d5d5d;}

Does that work?

lesmith
Aug 24th, 2007, 12:02 AM
Still no difference.

!!!

twodayslate
Aug 24th, 2007, 12:17 AM
Do you want to change the email or the password?
try:
.topinput {background-color: #5d5d5d !important;}

6.2.1 The 'inherit' value

Each property may also have a specified value of 'inherit', which means that, for a given element, the property takes the same computed value as the property for the element's parent. The inherited value, which is normally only used as a fallback value, can be strengthened by setting 'inherit' explicitly.

Example(s):

In the example below, the 'color' and 'background' properties are set on the BODY element. On all other elements, the 'color' value will be inherited and the background will be transparent. If these rules are part of the user's style sheet, black text on a white background will be enforced throughout the document.

BODY {
color: black !important;
background: white !important;
}

* {
color: inherit !important;
background: transparent;
}

edit:// If this does not work can I see your page/code?