Click to See Complete Forum and Search --> : Problems with a CSS menu


dbrownh
10-23-2008, 10:35 PM
I am using a style sheet to set a menu for the top of my web page. However, I want to add a logo jpeg with a link back to the home page of my web site at the top left corner of the page prior to the menu popping in ( currently indented 391px). I am new to style sheets, but have come a long way but am frustrated. Here is my style sheet for the menu:

.menu{background:url(images/menu_bg.gif) 33px top no-repeat; height:140px; padding-left:391px;}
.menu a, .menu span{display:block; float:left; width:80px; height:69px; text-decoration:none; padding-top:71px; text-transform:uppercase; color:#B2A299; text-align:center;}
.menu a:hover, .menu span{text-decoration:none; background:url(images/menu_button_act.jpg) left top no-repeat; color:#DF7224;}

.menu .indent{margin:0 14px 0 8px;}
.menu .indent-2{margin:0 13px 0 11px;}
.menu .indent-3{margin-left:16px;}

.header{height:361px; background:url(images/header_bg.jpg) 33px top no-repeat}


and my HTML for the menu is as follows:

<div class="menu">
<span>Home</span>
<a href="index-1.html" class="indent">About us</a>
<a href="index-2.html">Services</a>
<a href="index-3.html" class="indent-2">Partners</a>
<a href="index-4.html">Support</a>
<a href="index-5.html" class="indent-3">Contacts</a>
</div>

Thanks in advance for a response...

Fang
10-24-2008, 05:42 AM
at the top left corner of the page prior to the menu popping inPlease explain 'popping in' and top left where exactly?

dbrownh
10-24-2008, 11:01 AM
Not inclusive of the hip hop rap style of dancing, popping in is a non technical term invented by the British meaning dropping in unexpectedly. Perhaps "before displaying" the menu would be better.

I want to place the graphic in-line to the menu on the left side, same number of px down as the menu and indented about 75 px in. The JPG is 220px wide and 110px high.

Thanks.

Fang
10-25-2008, 10:53 AM
<div class="menu" style="position:relative;">
<img style="position:absolute;top:71px;left:75px;" alt="" src="image.jpg" height="110" width="220">
<span>Home</span>

dbrownh
10-25-2008, 11:14 AM
Thank you. Much appreciated.