469,319 Members | 2,373 Online
Bytes | Developer Community
New Post

Home Posts Topics Members FAQ

Post your question to a community of 469,319 developers. It's quick & easy.

Problem with my header (help!)

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{height:80px;line-height:80px;margin: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="HAPedit 3.1">
<style type="text/css">
html,body{margin:0;padding:0}
body{font: 76% arial,sans-serif}
p{margin:0 10px 10px}
a{display:block;color: #981793;padding:10px}
div#header{height:80px;line-height:80px;margin:0;
padding-left:10px;background: #EEE;color: #79B30B}
div#content p{line-height:1.4}
div#navigation{background:#B9CAFF}
div#extra{background:#FF8539}
div#footer{background: #333;color: #FFF}
div#footer p{margin:0;padding:5px 10px}

div#wrapper{float:right;width:100%;margin-left:-200px}
div#content{margin-left:200px}
div#navigation{float:left;width:200px}
div#extra{float:left;clear:left;width:200px}
div#footer{clear:both;width:100%}
</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>

Aug 28 '06 #1
2 1498
~john wrote:
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.
http://k75s.home.att.net/banner.html

--
-bts
-Motorcycles defy gravity; cars just suck.
Aug 28 '06 #2
Replace this line:

<div id="header">[Left Logo] - [Right Logo]</div>

With:

<div id="header"><img src="right logo url" style="float: right;"><img
src="left logo url"></div>

Aug 29 '06 #3

This discussion thread is closed

Replies have been disabled for this discussion.

Similar topics

5 posts views Thread by bob | last post: by
11 posts views Thread by DaRemedy | last post: by
reply views Thread by george1069 george1069 | last post: by
reply views Thread by Prasanth U | last post: by
31 posts views Thread by Extremest | last post: by
2 posts views Thread by vinit_mahajan99 | last post: by
1 post views Thread by innivive | last post: by
reply views Thread by sa6113 | last post: by
reply views Thread by zhoujie | last post: by
reply views Thread by suresh191 | last post: by
reply views Thread by Gurmeet2796 | last post: by
reply views Thread by mdpf | last post: by
reply views Thread by harlem98 | last post: by
reply views Thread by listenups61195 | last post: by
By using this site, you agree to our Privacy Policy and Terms of Use.