I'm trying to define a block smaller than the full width of the screen and then have that block centered horizontally. I can get it to work with IE7, but not with Opera9 or Firefox2, which leads me to believe there is something wrong with my approach, even though the HTML and CSS validates.

Here's the page: http://www.wpcoe.com/index2.htm

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="en-us">
<head><title>test</title>
<meta http-equiv="Content-Type" content="text/html; charset=ISO-8859-1">
<STYLE type="text/css">
.block
{	width: 200px;
	background-color:#ff0;}
</style></head>
<body>
	<div style=text-align:center>
		<div class=block>text</div>
	</div>
</BODY></html>

How can I get that yellow container centered horizontally on the page, using valid HTML & CSS (not using a table)?

<div "style=margin: auto">

Thanks for the "reminder," stymiee.

Of course, I have used that very tag several times, but for some reason faced a mental block this time.