Right-o. Here's my sloppy, sloppy code (still trying to learn):
Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<link rel="stylesheet" type="text/css" href="Style.css">
</head>
<body>
<p>
<span class="MainBoxSplash">
<map name="TableWorkaround">
<div class="SplashContent">
<table class="SplashTitle" border="0" rules="cols" frame="vsides">
<tr><td>Text</td></tr>
<tr><td><img id="SplashBadge" src="badge.gif" alt=""></td></tr>
<tr><td>Text</td></tr>
</table>
</div>
<p id="SplashSlash">
<a class="SplashLink" href="Link.htm">English</a>
/
<a class="SplashLink" href="Link.htm">Français</a>
</p>
</map>
</span>
</p>
</body>
</html>
It has some table junk in it - I think I was trying to jerry-rig the HTML to display like I want to in IE. No luck. Here's the relevant CSS code (since it isn't in the same document):
Code:
body {
background-color: #660000;
text-align: center;
font-size: 100%;
}
div.SplashContent {
margin: 0px;
margin-top: 5px;
width: 460px;
background-color: #ffffff;
border-style: solid;
border-width: 1px;
font-size: 2em;
padding-top: 10px;
margin-left: 5px
}
img#SplashBadge {
border-style: solid;
border-color: #000000;
border-width: 0px;
margin: 0px;
margin-top: 10px;
}
p#SplashSlash {
margin-top: 7px;
font-size: 1.125em;
}
span.MainBoxSplash {
margin: auto;
width: 472px;
height: 330px;
background-color: #dddddd;
border-style: solid;
border-width: 1px;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
}
table.SplashTitle {
margin: 0px;
margin-left: auto;
margin-right: auto;
margin-bottom: 10px;
text-align: center;
border-width: 0px;
}
Probably a lot of useless junk in there, too. Note - the code is probably bare-bones, since I've taken anything out that might identify what it is. The site I'm trying to throw together is a bit political for BAUT.
Edit: Tofu, just looked into your code. Interesting, but it isn't centred in either browser.
Edit 2: I forgot to say that I ran both codes through the w3 validators. They passed.