No replies
Last seen: 10 years 8 weeks ago
Timezone: GMT+1
Joined: 2010-08-04
Posts: 1
Points: 2


I've been tearing my hair out trying to get my horizontal menu to work across all browsers:

It doesn't work in IE6 or 7 because I have used inline-block as opposed to inline when setting the display properties for the li's. So I have started from scratch in trying to get it to display properly; here's the basic code I have used:

<div id="menu">
			//Build Menu
			foreach ($pages as $id => $page)
				if ($id != 'home' && $id == $req_page)
					echo "<li class='selected'>".$page."</li>"; 			
				elseif ($id != 'home')	
					echo "<li><a href='/".$id."/'>".$page."</a></li>";


/* Main Menu */
	float: right;
	height: 159px;
	margin-right: 10%;
#menu ul {
	list-style: none;
	color: #FFF;		
#menu ul li {
	display: inline;	
#menu ul li.selected {
	background-color: #FFF;
	color: #C50000;
	padding: 0 30px;
	font-weight: bold;
	border: 1px solid #000;
	border-width: 0 3px;
#menu ul li a {
	padding: 0 30px;
	color: #DDD;
	text-decoration: none;
#menu ul li a:hover {
	color: #FFF;

Thanks for any help.