HTML 4 & CSS 3: required input needs custom background-color
I need to change background color of required inputs in a form.
Following code doesn't work:
CSS
Tested in browsers FF 17.0.1 and IE 9 with latest patches.
Only HTML 4 and CSS 3 is acceptable.
Following code doesn't work:
CSS
input[type="text"] .required { background-color: yellow; }
input .required { background-color: yellow; }
<input class="required" type="text" id="email" name="email">
Tested in browsers FF 17.0.1 and IE 9 with latest patches.
Only HTML 4 and CSS 3 is acceptable.
Do more with
EXPERT OFFICE® is a registered trademark of EXPERTS EXCHANGE®
just
.required { background-color: yellow; }
or you can also write :
#email { background-color: yellow; }
.required { background-color: yellow; }
or you can also write :
#email { background-color: yellow; }
Several variations work fine but 'input .required' with a space in the middle didn't.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<title>CSS Input BG</title>
<style type="text/css">
<!--
input.required { background-color: yellow; }
.required2 { background-color: blue; }
#email3 { background-color: green; }
-->
</style>
</head>
<body>
<h1>CSS Input BG</h1>
<form action="">
<input class="required" type="text" id="email" name="email"><br>
<input class="required2" type="text" id="email2" name="email2"><br>
<input class="required3" type="text" id="email3" name="email3"><br>
<input type="submit" value="Submit" />
</form>
</body>
</html>
Premium Content
You need an Expert Office subscription to comment.Start Free Trial