✔ Listen-Navi rechts ausrichten

[Grille]

Hallo,

ich habe eine automatisch generierte Liste, die css-Formatiert meine Navigation bildet (horizontal). Diese befindet sich in einer DIV-box ...

Ich möchte nun, dass alle Buttons rechtsbündig angezeigt werden, hatte aber mit "text-algin: right;" auf meine DIV-box nur wenig Erfolg.

HTML

<div id="menu_box">
<div class="dropnav">
<ul>
<li><a href="index.php?id=6" title="eins"  >ERSTE</a></li>
<li><a href="index.php?id=6" title="zwei"  >ZWEITE</a></li>
<li><a href="index.php?id=6" title="drei"  >DRITTE</a></li>
</ul>
</div>
</div>

eigentlich soll die "dropnav" in der "menu_box" auf die rechte Seite. Aber das einfügen von "text-align: right;" bringt nichts.

CSS

#menu_box {
width: 416px;
padding: 30px 0px 0px 150px;
text-align: right;
}
.dropnav {
white-space:nowrap /*IE hack*/;
float:left;
border:none;
margin:0px 0px 0px auto;
font-size:0.8em;
}
.dropnav ul {
list-style-type:none;
}
/*erste Ebene nicht aktiv*/
.dropnav ul li {
background: url("/fileadmin/templates/img/basic/button_bg_ia.png") #111 repeat-x;
float:left;
z-index:auto !important /*Non-IE6*/;
z-index:1000 /*IE6*/;
margin:0px 1px
}

 

[Maik]

Hi,

tausch mal für das <li>-Element float:left gegen float:right aus.

Mit text-align:right funktioniert es so:

.dropnav {
white-space:nowrap; /*IE hack*/
float:right; /* anstelle von float:left, wenn float benötigt wird */
border:none;
margin:0px 0px 0px auto;
font-size:0.8em;
}
.dropnav ul {
list-style-type:none;
text-align:right;
}
/*erste Ebene nicht aktiv*/
.dropnav ul li {
background: url("/fileadmin/templates/img/basic/button_bg_ia.png") #111 repeat-x;
display:inline;
z-index:auto !important; /*Non-IE6*/
z-index:1000; /*IE6*/
margin:0px 1px
}

mfg Maik

 

[Grille]

VIELEN DANK ... schonwieder hast Du recht!

Ich habe auch schon kurz darüber nachgedacht, ob das was mit dem Float zu tun haben könnte ... fand das dann aber doch absurd und habe es verworfen ... DANKE!