CSS problem

clandestinex337

In Runtime
Messages
396
CSS problem updated

how can i fix the way it looks in IE to look like it does in FF?

FF
http://img.photobucket.com/albums/v398/cla...igns/help10.gif

IE
http://img.photobucket.com/albums/v398/cla...igns/help11.gif

the boxes are messed up in IE

heres my HTML/CSS code
Code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<title>Clandestine Designs |Home</title>
<style type="text/css"> 
@import url(style.css);.style7 {
	font-size: 16px;
	font-weight: bold;
	font-style: italic;
}
</style>
</head>

<body>

<div id="container">
	<div id="banner"></div>
	<div id="navigation">
	  <div align="center">
	  <img src="images/home.gif" />
	  <img src="images/portfolio.gif" width="150" height="26" />
	  <img src="images/services.gif" width="150" height="26" />
	  <img src="images/about.gif" width="150" height="26" />
	  <img src="images/contact.gif" width="150" height="26" /></div>
  </div>
	<div id="spacer_top">
	  <br />
	  <h1>News</h1>
	</div>
	<div id="side_spacer01">
	  <br />
	  <h1>Latest Additions</h1>
	</div>
	<div id="content_float">
		<div id="content_top"></div>
	 	<div id="content_bg">
		<div id="content_text">
			<h2><i>"Time to get to work"</i> 01-02-06</h2>
			<br />
			<p>Hello and welcome to Clandestine Designs. So I just finished coding my website in CSS, 		and it looks like it was a success! So now that I have the site all designed and published its time to get down to the dirty work and start creating things to add. Im planning ahead and just went and made my portfolio before I even had my portfolio class yet. Its better to be prepared than not prepared. In the next couple weeks or days I will slowly BUT surely adding new content to my portfolio. I hope you enjoy your stay and thank you for visiting my portfolio page.</p>
			<br />
			<h3>-Devyn</h3>
		</div>
	  </div>
		<div id="content_btm"></div>
	</div>
	<div id="spacer_left"></div>
	<div id="latest_float">
		<div id="latest_top"></div>
		<div id="latest_bg">
			<div id="latest_text">
				<p align="center">underwork</p>
			</div>
		</div>
		<div id="latest_btm"></div>
	</div>
	<div id="side_spacer02">
	  <br />	
	  <h1>Links</h1>
	</div>
	<div id="stuff_float">
		<div id="stuff_top"></div>
 	  <div id="stuff_bg">
			  <div id="stuff_text">
		 		<p>If you would like your link to be on my portfolio website please send me a <a href="mailto:clandestinex337@gmail.com">e-mail</a></p>
		  </div>
		</div>
		<div id="stuff_btm"></div>
	</div>
	<div id="footer"></div>
</div>

</body>
</html>
Code:
/* CSS Document */
*{
	  padding:0;
	  margin:0;
	  border:0;
}
body{
	background:#fff;
	font:12px verdana,sans-serif;
}
h1{
	font-size:18px;
}
h2{
	text-align:left;
	font-size:16px;
}
h3{
	text-align:right;
	font-size:14px;
	font-style:italic;
}
a:link,
a:visited{
	color:#fc9a2a;
	text-decoration:underline;
}
a:active,
a:hover{
	color:#ff8800;
	background:#F7F1E6;
}
#container{
	width:766px;
	height:100%;	
	background:color:#e3e3e3;
	margin-left:auto;
	margin-right:auto;
}
#banner{
	background:url(images/banner.gif);
	width:766px;
	height:201px;
}
#navigation{
	width:766px;
	height:26px;
	margin-top:1px;
	margin-left:auto;
	margin-right:auto;
}
#spacer_top{
	float:left;
	width:565px;
	height:44px;
}
#side_spacer01{
	float:left;
	width:201px;
	height:44px
}
#content_float{
	width:531px;
	float:left;
}
#content_text{
	width:527px;
	margin:0 auto;
}
#content_top{
	  padding:0;
	  margin:0;
	  border:0;
	background:url(images/content_top.gif);
	width:531px;
	height:9px;
}
#content_bg{
	background:url(images/content_bg.gif);
	width:531px;
	height:100%;
}
#content_btm{
	  padding:0;
	  margin:0;
	  border:0;
	background:url(images/content_bottom.gif);
	width:531px;
	height:9px;
}
#spacer_left{
	float:left;
	background:url(images/spacer.gif);
	width:28px;
	height:504px;
	margin-left:3px;
}
#latest_float{
	float:right;
	width:201px;
}
#latest_text{
	width:197px;
	margin:0 auto;
}
#latest_top{
	background:url(images/sides_top.gif);
	width:201px;
	height:9px;
}
#latest_bg{
	background:url(images/sides_bg.gif);
	width:201px;
	height:100%;
}
#latest_btm{
	background:url(images/sides_bottom.gif);
	width:201px;
	height:9px;
}
#side_spacer02{
	float:right;
	width:201px;
	height:44px;
}
#stuff_float{
	float:right;
	width:201px;
}
#stuff_text{
	width:197px;
	margin:0 auto;
}
#stuff_top{
	background:url(images/sides_top.gif);
	width:201px;
	height:9px;
}
#stuff_bg{
	background:url(images/sides_bg.gif);
	width:201px;
	height:100%;
}
#stuff_btm{
	background:url(images/sides_bottom.gif);
	width:201px;
	height:9px;
}

THank you soo much

:D
 
Back
Top Bottom