Thisi s a sample layout using CSS. I can't get my two DIV'S to line up horizontally along their tops. I'm using IE as that is all we use at work. Any ideas on what I can do?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
#whole{
height: 100%;
width: 100%;
text-align: center;
}
#whole #back {
position: relative;
width: 780px;
background-image: url(border.jpg);
height: 100%;
text-align: left;
}
#whole #back #flash {
position: relative;
border: 2px solid #336699;
width: 540px;
top: 25px;
left:215px;
}
#whole #back #homepage{
position: relative;
border: 2px solid #336699;
width: 180px;
top: 25px;
left: 20px;
background-color: #FFFFFF;
}
#whole #back #homepage p {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: italic;
padding: 3px;
text-align: center;
}
#whole #back #homepage p input{
vertical-align: middle;
}
-->
</style>
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div id="whole">
<div id="back">
<div id="homepage">
<p>
<label for="Homepage">My Default Homepage:</label>
<input name="Homepage" type="checkbox" value="yes" checked>
</p>
</div>
<div id="flash">
<object classid="clsid
27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://Download .macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="540" height="100">
<param name="movie" value="water.swf">
<param name="quality" value="high">
<embed src=http://www.webdeveloper.com/forum/archive/index.php/"water.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="540" height="100"></embed></object>
</div>
</div>
</div>
</body>
</html>
thanks
TomI fixed my problem by changing the positioning from relative to absolute.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Untitled Document</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<style type="text/css">
<!--
#whole{
height: 100%;
width: 100%;
text-align: center;
}
#whole #back {
position: relative;
width: 780px;
background-image: url(border.jpg);
height: 100%;
text-align: left;
}
#whole #back #flash {
position: relative;
border: 2px solid #336699;
width: 540px;
top: 25px;
left:215px;
}
#whole #back #homepage{
position: relative;
border: 2px solid #336699;
width: 180px;
top: 25px;
left: 20px;
background-color: #FFFFFF;
}
#whole #back #homepage p {
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-style: italic;
padding: 3px;
text-align: center;
}
#whole #back #homepage p input{
vertical-align: middle;
}
-->
</style>
</head>
<body leftmargin="0" topmargin="0" marginwidth="0" marginheight="0">
<div id="whole">
<div id="back">
<div id="homepage">
<p>
<label for="Homepage">My Default Homepage:</label>
<input name="Homepage" type="checkbox" value="yes" checked>
</p>
</div>
<div id="flash">
<object classid="clsid
27CDB6E-AE6D-11cf-96B8-444553540000" codebase="http://Download .macromedia.com/pub/shockwave/cabs/flash/swflash.cab#version=6,0,29,0" width="540" height="100"><param name="movie" value="water.swf">
<param name="quality" value="high">
<embed src=http://www.webdeveloper.com/forum/archive/index.php/"water.swf" quality="high" pluginspage="http://www.macromedia.com/go/getflashplayer" type="application/x-shockwave-flash" width="540" height="100"></embed></object>
</div>
</div>
</div>
</body>
</html>
thanks
TomI fixed my problem by changing the positioning from relative to absolute.