CODEWITHSUNDEEP
htmlcsscross-browserweb
Ben G
Ben G

Reputation: 26789

CSS doesn't work in IE7, works in other browsers

<html>
<head>
<style>
#content input[type=text]
{
    color: green;
}
</style>
</head>
<body>
<div id="content">
<input type="text" value="Some Text" />
</div>
</body>
</html>

Here's how it renders in FireFox (font is green):

enter image description here

Here's how it renders in Internet Explorer 7 (font is not green):

enter image description here

Update: Adding the DTD solved the issue, however when the input is set to disabled="disabled", IE7 still won't show the specified color.

Upvotes: 0

Views: 634

Answers (5)

GolezTrol
GolezTrol

Reputation: 116190

You'll need to add a strict doctype for IE7 to support attribute selectors with a value.

http://msdn.microsoft.com/nl-nl/library/aa770069

Use a doctype like this, which is about as loose as you can get without breaking this functionality:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN" 
"http://www.w3.org/TR/html4/loose.dtd">

Or rather use a more recent and more strict one, if you can.

Upvotes: 2

Deep Frozen
Deep Frozen

Reputation: 2075

Maybe not what you wanted, but at least it works ;)

<html>
<head>
<style type="text/css">
.green {
    color: green;
}
</style>
</head>
    <body>
        <div id="content">
            <input type="text" class="green" value="Some Text" />
        </div>
    </body>
</html>

Upvotes: 0

Joseph Marikle
Joseph Marikle

Reputation: 78590

You are running your site in Quirks mode. use the following doctype or similar

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">

Upvotes: 1

Evan Mulawski
Evan Mulawski

Reputation: 55354

Try using quotes:

input[type="text"]

Alternatively, use a class and apply that class to all of your text inputs.

Upvotes: 0

tcnarss
tcnarss

Reputation: 595

try this for starters <style type="text/css">

Upvotes: 0

Related Questions