No replies
realstiner
realstiner's picture
Offline
newbie
Belgium
Last seen: 9 years 32 weeks ago
Belgium
Timezone: GMT+1
Joined: 2011-02-08
Posts: 1
Points: 2

Hi guys,

i'm having a problem with a menu navigation bar (horizontally) i'd like to create...
I have all my buttons with the text already on it made in Photshop (even the hover buttons) & saved them seperatly.

If I want to get this in my CSS website, I can't get it right. I tried already a couple of tutorials but nothing really works as it should.

So, what I would like to have is a horizontal navigation bar (background-image is set) with buttons...
My code so far for this element in my html:

<div class="menu_block">
                	<ul id="menu">
                		<li class="home"><a href="index.html"><img src="images/menu/home.png" /></a></li>
                    	<li class="test1"><a href="index-02.html"><img src="images/menu/test1.png" /></a></li>
                    	<li class="test2"><a href="index-03.html"><img src="images/menu/test2.png" /></a></li>
                    	<li class="test3"><a href="index-04.html"><img src="images/menu/test3.png" /></a></li>
                        <li class="test4"><a href="index-05.html"><img src="images/menu/test4.png" /></a></li>
                	</ul>
                </div>

So I have the hoverbuttons called home_hover.png; test1_hover.png; etc....

& CSS I only have this:

.menu_block {  
    display:block;
	border:0px;
	background-image:url(../images/menu_back.png);
	background-repeat:no-repeat;
	margin-top:20px;
	margin-left:50px;
	height:75px;
    padding:0px;  
    overflow:auto;  
}  

Someone can help me out on this one??? Thx!