Jad Madi wrote:
Hi,
I'm trying to get logo float over the mainnav in this page
http://easyhttp.com/css/css-ads.html
any idea how can I make it ?
Hi Jad,
in this case I would not use a background image for the logo... If you
want to place it over the #main-nav you can do it using absolute
positioning, by giving 'position:relative' to the main container
#google-468-60 and then placing the logo and the main-nav with absolute
positioning.
This is a solution (Sorry, I have done many changes to code)
-----------------------------------
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd";>
<html>
<head>
<title>web site hosting, dedicated servers, reseller web hosting</title>
<style type="text/css">
body {
background:#fff;
font:x-small/1.5em tahoma;
color:#000;
}
body *{ margin:0; padding:0;}
#google-468-60 {
background-color:#fff;
border:1px solid black;
width:460px;
height:55px;
position:relative;
}
#main-nav {
border-top:1px solid #000;
background-color:#ff9000;
clear:right;
text-align:center;
width:460px;
position:absolute; bottom:0px;
}
#main-nav li {
display: inline;
text-align:justify;
}
#main-nav a {
color:#000;
text-decoration:none;
border:1px solid #ff9000;
font-size:70%;
padding-right:5px;
color:#fff;
}
#main-nav a:hover {
border:1px solid #000;
font-size:70%;
padding-right:5px;
color:#fff;
}
#google-468-60 p {
border:1px solid red;
width:35%;
float:right;
text-align:center;
}
#logo {
width:70px;
height:51px;
position:absolute;
top:1px;
left:1px;
}
/* IE Hack */
* html #main-nav{bottom:-1px;}
</style>
</head>
<body>
<div id="google-468-60">
<p>EasyHTTP Network Inc.</p>
<div id="main-nav">
<ul>
<li><a href="http://EasyHTTP.com/webhosting/shared/"; title="EasyHTTP
shared webhosting">Shared Hosting</a></li>
<li><a href="http://EasyHTTP.com/webhosting/VPS/"; title="EasyHTTP VPS
hosting">VPS Hosting</a></li>
<li><a href="http://EasyHTTP.com/webhosting/Library/"; title="EasyHTTP
Hosting Library">Hosting Library</a></li>
</ul>
</div><img id="logo"
src="http://www.easyhttp.net/logos/easyhttp70.gif"; alt=""/></div>
</body>
</html>
------------------------------------
Hope this helps,
Gianni Cuccu
http://www.getidea.it
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/
![http://www.easyhttp.net/logos/easyhttp70.gif"](http://www.easyhttp.net/logos/easyhttp70.gif"){kind=link}