I'm trying to get my header to have 2 images, one for the top left and
one for the top right. Here's a link to my page...
http://levelwave.com/dev/div/index.html
[Left Logo] and [Right Logo] will eventually be images but what I'm
wanting is for the [Left Logo] to be aligned left and [Right Logo] to
be aligned right. As of now they're both squished to the left and I'm
not sure how to change my CSS to do this.
Here's my CSS for my header div
div#header{heig ht:80px;line-height:80px;mar gin:0;}
The entire code page is below... any ideas?
thanks,
~john
-------------------------------------------
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<title>Layout 24</title>
<meta http-equiv="content-type" content="text/html;
charset=iso-8859-1">
<meta name="generator " content="HAPedi t 3.1">
<style type="text/css">
html,body{margi n:0;padding:0}
body{font: 76% arial,sans-serif}
p{margin:0 10px 10px}
a{display:block ;color: #981793;padding :10px}
div#header{heig ht:80px;line-height:80px;mar gin:0;
padding-left:10px;backg round: #EEE;color: #79B30B}
div#content p{line-height:1.4}
div#navigation{ background:#B9C AFF}
div#extra{backg round:#FF8539}
div#footer{back ground: #333;color: #FFF}
div#footer p{margin:0;padd ing:5px 10px}
div#wrapper{flo at:right;width: 100%;margin-left:-200px}
div#content{mar gin-left:200px}
div#navigation{ float:left;widt h:200px}
div#extra{float :left;clear:lef t;width:200px}
div#footer{clea r:both;width:10 0%}
</style>
</head>
<body>
<div id="header">[Left Logo] - [Right Logo]</div>
<div id="wrapper">
<div id="content">
</div>
</div>
<div id="navigation" >
</div>
<div id="extra">
<p><strong>3) More stuff here.</strongvery text make long column
make filler fill make column column silly filler text silly column fill
silly fill column text filler make text silly filler make filler very
silly make text very very text make long filler very make column make
silly column fill silly column long make silly filler column filler
silly long long column fill silly column very </p>
</div>
<div id="footer"><p> Here it goes the footer</p></div>
</body>
</html>