...

View Full Version : CSS Logo Not Lining Up Right with Container DIV



gottarunnow
12-09-2009, 01:45 AM
Hello! I'm building my first Website with CSS. While it's been good, I still have a lot to learn! I'm stumped on this one and am needing your help!

Here's the page on staging:
http://staging.perfectchip.com/guardianfoods/index.html

And here's what it should look like:
http://staging.perfectchip.com/guardianfoods/comps/bg_4.jpg

Originally, I had the logo as part of the background image. But I wanted to make it clickable, so I found a tutorial that helped with that but now, it's not staying within the "wrapper" container. I want the logo to stay with the rest of the template, in the correct place as the browser resolution changes.

Also, I can't figure out how to add space between my Navigation buttons like I show it on the Comp.

Please o please help me! :)

Excavator
12-09-2009, 05:21 AM
Hello gottarunnow,
Using the containers you have now, you could ap that image once you move it into #content.
Like this -
markup

<div id="wrapper">
<div id="content"><a href="index.html" title="Guardian Foods" id="logo">Guardian Foods</a>
<ul id="topnav">
<li class="home"><a href="index.html">Home</a></li>
<li class="services"><a href="services.html">Services</a></li>
<li class="clients"><a href="client
CSS

#content {
clear: both;
width: 840px;
margin: 180px auto 0;
background: #fff;
border: solid 3px #e7bb5a;
-moz-border-radius: 20px;
-webkit-border-radius: 20px;
border-radius: 20px;
padding: 20px;
position: relative;
}
#logo {
width: 255px;
height: 122px;
background: #fff url(../images/gf-logo.gif);
position: absolute;
top: -140px; /*adjust here*/
left: 0; /*adjust here*/
}

gottarunnow
12-10-2009, 01:51 AM
Excavator! You are a God send! Thank you so much. That makes so much sense and worked beautifully!

You made my day!

Sincerely gottarunnow



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum