Tilted Forum Project Discussion Community - View Single Post - Isn't Mozilla supposed to be CSS compliant?

Stompy · 06-02-2004, 09:24 AM

hahaha man, I really hate doing this stuff.

Now IE is completely ignoring a font style tag for a select object. The font reflects in the body, but NOT the select. Notice that there IS a select style specifier. There are even multiple declarations of it just to cover all ground.

The page (both HTML and CSS) validates perfectly fine on w3.org. This stuff is asinine. What's the point in making these specifications if the browser renderings are hit & miss?

The funny thing: another site I have that specifies a font on the select tag works just fine. Exact same code and all.

Oh, and looky that... specify a width CSS style ( width: 40px; ) in the select and the WIDTH is set fine, but no font! Interesting, huh?

Now, add a font-size. It magically works. Forget about inheriting the style from the body!!

I just want someone to look at this and verify that it's not me going crazy.

I guess this thread shoulda been called "why the hell can't browsers render CSS?"

[edit]
Scratch this example. My comp was being stupid. I rebooted and it shows the font just fine, however, the first example I posted is still not working

Code:

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
	<head>
		<style type="text/css">
			body
			{

				font-family: Arial;
				font-size: 11px;
				background-color: #eeeeee;
			}

	
			select
			{
				font-family: Arial;
			}
		
			#DateRangeSelector 
			{
				padding: 5px;
				width: 225px;
			}
			#DateRangeSelector div
			{
				padding: 5px;
				height: auto;
			}
			#DateRangeSelector
			{
				border: solid 1px #000000;
			}

			#DateRangeSelector .label, #DateRangeSelector .Month, #DateRangeSelector .Day, #DateRangeSelector .Year
			{
				background-color: #cccccc;

			}
			#DateRangeSelector .label
			{
				float: left;
				text-align: right;
				width: 50px;
			}

			#DateRangeSelector .Month, #DateRangeSelector .Day
			{
				float: left;
			}
		</style>
	</head>
	<body>
		<div id="DateRangeSelector">
			<div class="label">From:</div>
			<div class="Month">
				<select>
					<option>01</option>
					<option>02</option>
					<option>03</option>
					<option>04</option>
					<option>05</option>
					<option>06</option>
					<option>07</option>
					<option>08</option>

				</select>
			</div>
			<div class="Day">
				<select>
					<option>01</option>
					<option>02</option>
					<option>03</option>
					<option>04</option>
					<option>05</option>
					<option>06</option>
					<option>07</option>
					<option>08</option>

				</select>
			</div>
			<div class="Year">
				<select>
					<option>2001</option>
					<option>2002</option>
					<option>2003</option>
					<option>2004</option>
					<option>2005</option>
					<option>2006</option>

				</select>
			</div>

			<div class="label">Thru:</div>
			<div class="Month">
				<select>
					<option>01</option>
					<option>02</option>
					<option>03</option>
					<option>04</option>
					<option>05</option>
					<option>06</option>
					<option>07</option>
					<option>08</option>

				</select>
			</div>
			<div class="Day">
				<select>
					<option>01</option>
					<option>02</option>
					<option>03</option>
					<option>04</option>
					<option>05</option>
					<option>06</option>
					<option>07</option>
					<option>08</option>

				</select>
			</div>
			<div class="Year">
				<select>
					<option>2001</option>
					<option>2002</option>
					<option>2003</option>
					<option>2004</option>
					<option>2005</option>
					<option>2006</option>

				</select>
			</div>

		</div>
	</body>
</html>