...

View Full Version : Float Problem



Erindesign
10-20-2006, 08:17 PM
I have a menu made of ul/li. The links are images. To keep them in one line, I did float:right, but the problem is that they float right. If I take float off, they center but one under another. The problem stands on the float under .menu li IMO.

What do I do to center the whole ul, and show in one row?

HTML:


<div class="menu">
<ul>
<li><a href=?jeshil=news/show_news.php><img src=images/hyrje.gif class=image></a></li>
<li><a href=?jeshil=audio.php><img src=images/audio.gif class=image></a></li>
<li><a href=?jeshil=video.php><img src=images/video.gif class=image></a></li>
<li><a href=komunitet><img src=images/komunitet.gif class=image></a></li>
<li><a href=?jeshil=projekte.php><img src=images/projekte.gif class=image></a></li>
<li><a href=?jeshil=lidhje.php><img src=images/lidhje.gif class=image></a></li>
<li><a href=?jeshil=mbeshtetje.php><img src=images/mbeshtetje.gif class=image></a></li>
<li><a href=?jeshil=studiojeshil.php><img src=images/studiojeshil.gif class=image></a></li>
<li><a href=?jeshil=kontakt.php><img src=images/kontakt.gif class=image></a></li>
</ul>
</div>


CSS


.menu{
height: 52px;
width: 747px;
margin: 0px;
padding: 0px;
text-align:center;
}
.menu ul {
margin: 0;
padding-top: 7px;
text-align: center;
}
.menu li {
list-style-type: none;
float:right;
list-style-image: url(images/nav-bullet.gif);
margin: 0 7px 0;
color: #224570;
}
.menu li a, .menu li a:visited {
color: #224570;
text-decoration: none;
}
.menu li a:hover {
text-decoration: underline;
}

VIPStephan
10-20-2006, 10:07 PM
Assign a width to your ul and apply margin: 0 auto;.
You see what it does if you put a border around the ul (or any element that makes problems).



EZ Archive Ads Plugin for vBulletin Copyright 2006 Computer Help Forum