<li> nicht untereinander ie

[Akuro]

Hi folks,
its me again

nav.php

<ul id="navi">
<li><?php echo $var1; ?><a href="index.php">Startseite</a></li><a href="index.php">|</a>
<li><?php echo $var2;?><a href="wirueberuns.php">Wir &uuml;ber uns</a></li><a href="wirueberuns.php">|</a>
<li><?php echo $var3;?><a href="waswirmachen.php">Was wir Machen</a></li><a href="waswirmachen.php">|</a>
<li><?php echo $var4;?><a href="mitgliedwerdn.php">Mitglied werden</a></li><a href="mitgliedwerdn.php">|</a>
<li><?php echo $var5;?><a href="kontakt.php">Kontakt</a></li><a href="kontakt.php">|</a>
<li><?php echo $var6;?><a href="impressum.php">Impressum</a></li>
</ul>

nav.css

#navi  a{
color:#ffffff;
font-family:Verdana,Helvetica,Arial,sans-serif;
font-size:12px;
padding: 0 0 0 5px;
margin-left:00px;
line-height:30px;
text-decoration:none;
text-align:center;
z-index:12;
float:left;
}
.active
{
    text-decoration: underline;
}
#navi  a:hover{
color:#ffffff;
font-family:Verdana,Helvetica,Arial,sans-serif;
font-size:12px;
padding: 0 0 0 5px;
margin-left:00px;
line-height:30px;
text-decoration:none;
text-align:center;
z-index:12;
float:left;
}
#navi  {
text-align:center;
list-style-type:none;
width:780px;
margin-top:-30px;
margin-left:240px;
position:relative;
display:block;
height:33px;
vertical-align:middle;
font-size:10px;
color:#ffffff;
font-family:Verdana,Helvetica,Arial,sans-serif;
font-size:12px;
padding:0;
line-height:30px;
text-decoration:none;
z-index:12;
float:left;
}
 
#nav  {
list-style-type:none;
width:780px;
margin-top:250px;
margin-left:30px;
position:relative;
display:block;
height:33px;
font-size:10px;
color:#ffffff;
font-family:Verdana,Helvetica,Arial,sans-serif;
font-size:12px;
padding:0;
line-height:30px;
text-decoration:none;
z-index:12;
float:left;
}
#nav  a{
color:#011bc1;
list-style-type:none;
width:780px;
font-size:10px;
font-family:Verdana,Helvetica,Arial,sans-serif;
font-size:12px;
padding:0;
line-height:30px;
text-decoration:underline;
z-index:12;
float:left;
}

es wird alles in die index.php integriert, im firefox wird es alles schoen nebeneinander angezeigt, der ie zeigt die liste trotzdem untereinander an.

weiss jemand rat?

gruß
daniel

 

[threadi]

Entferne diese sinnfreien

<a href="index.php">|</a>

zwischen den <li>'s, denn da gehört nichts hin. Wenn Du Trennstriche zwischen den <li>'s haben willst, bau diese ohne Verlinkung innerhalb der <li>'s ein.

 

[Akuro]

hi,

hab ich auch gemerkt .. ist raus wird allerdings immernoch nicht nebeneinander angezeigt!

 

[threadi]

Das könnte daran liegen, dass Du nur die Links mit Eigenschaften versiehst die sowieso im Zusammenhang sinnfrei sind. Du müsstest auch die li's mit Eigenschaften versehen.

Ergänze also für die Links noch "display: block" und für die li's noch "display: inline;".

Sollte auch das nicht fruchten zeig einen Link auf deine Webseite.

 

[Akuro]

Hallo thredi,

vielen dank für deine Hilfe, es tut.
gruß
daniel

 

[micronix]

Hallo Threadi,

ich hätte hierzu eine Frage:

zwischen den <li>'s, denn da gehört nichts hin. Wenn Du Trennstriche zwischen den <li>'s haben willst, bau diese ohne Verlinkung innerhalb der <li>'s ein.

Ist es nicht korrekter, wenn man für Trenner extra Listenpunkte verwendet?

Beispiel:

<ul>
<li>Punkt 1</li>
<li>|</li>
<li>Punkt 2</li>
<li>|</li>
<li>Punkt 3</li>
</ul>

MfG

 

[T!P-TOP]

Nein, du musst und solltest auch nicht extra ein neues Listen Element für eine einfach Trennlinie verwenden - um so weniger Code, um so besser.

Entweder machst die Striche neben den Text rein, oder formatiere doch einfach einen Border übers CSS.