Hello!
I’m a designer learning CSS on my own so I can go to the university with some base knowledge. I put apart a newsletter comp trying to put it back together. If you copy the code and open it in browser, you will see that it doesnt float properly. I’m stuck and frustrated. Please fix this basic code for me and point out my mistakes. Thank you for all the help!
[code=html]
<!DOCTYPE html PUBLIC “-//W3C//DTD XHTML 1.0 Strict//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd”>
<html xmlns=”http://www.w3.org/1999/xhtml”>
<head>
<title></title>
<link rel=”stylesheet” type=”text/css” href=”newsletter.css” />
</head>
<body>
<div id=”wrapper”>
<div id=”header”><img src=”comp/header.png” /></div>
<div id=”content3″></div>
<div id=”content2″>
<p class=”text”>;</p>
</div>
</div>
</div>
<div id=”footer”> <p class=”copyright”>Copyright ©2014 [email][email protected][/email]</p></div>
</div>
</div>
</body>
</html>
CSS:
[code]
html, body, h1, h2, h3, p, ul, li, img, a{
margin:0;
padding:0;
border:0;
text-decoration:none;
list-style:none;
font-family: arial;
}
#wrapper {
width:600px;
height:1000px;
margin:auto;
}
#header {
color:#FFF;
float:left;
width:600px;
height:218px;
background-image:url(“comp/header.png”);
background-position: top left;
background-repeat: no-repeat;
}
#content3{
font-size:11px;
color:#00008b;
float:right;
background:#b8c4ce;
width:202px;
height:686px;
background-image:url(“comp/more to read.png”);
background-position: top left;
background-repeat: no-repeat;
text-align:left;
list-style-type:none;
letter-spacing:3px;
}
#content2{
font-size:12px;
color:#000;
float:left;
clear:left;
width:398px;
height:686px;
background:#FFF;
background-repeat:no-repeat;
text-align:left;
}
#footer{
float:left;
clear:right;
background:#f9eb9a;
width:600px;
height:142px;
background-image: url(“comp/footer.png”);
background-repeat:no-repeat;
text-align:center;
text-shadow:1px 1px white;
}
.text{
padding:8px;
width:390px;
}
.copyright{
margin-top:25px;
}