CSS Navigation

Computer: Software & Programmierung HTML & CSS
#1

Hallo,
eine Frage zur vertikalen Navigation die mit CSS formatiert wurde. Im IE sind die Zeilen mit den Navi-Links breiter (soll nicht sein) als im Firefox und Opera, dafür zeigt der IE die Linien schön gestrichelt an während Firefox/Opera nur gepunktete Linien zeigen. Alles wurde mit einer externen CSS-Datei formatiert. Zur besseren Klarheit hier der Link
http://www.pkv-selbstvergleich.de

Weiss jemand wie ich das in allen drei Browsern hinkriege, dass die Zeilen schön schmal sind mit gestrichelten Linien.

Gruß
Kukuruz

#2

Hallo,

eine Frage zur vertikalen Navigation die mit CSS formatiert
wurde. Im IE sind die Zeilen mit den Navi-Links breiter (soll
nicht sein) als im Firefox und Opera,

Dann solltest du padding- und margin-Werte aller Elemente, die in deiner Navigation auftauchen, per Hand setzen, damit keine Browserspezifischen Defaults verwendet werden.

dafür zeigt der IE die
Linien schön gestrichelt an während Firefox/Opera nur
gepunktete Linien zeigen.

Ich hab in deinem CSS auch kein border-style: dashed; gefunden. Wo definierst du das denn?
Grüße,
Moritz

#3

Hallo,

Dann solltest du padding- und margin-Werte aller Elemente, die
in deiner Navigation auftauchen, per Hand setzen, damit keine
Browserspezifischen Defaults verwendet werden.

Das verstehe ich jetzt nicht, wie per Hand? Ich poste mal die CSS-Formatierungen:

#navcontainer ul{
margin-left: 0px;
padding-left: 0px;
font-family: Verdana, Arial;
font-size: 9pt
list-style-type:none;
}
#navcontainer a{
display: block;
padding-left: 14px;
width: 136px;
background-image: url(‚punkt.gif‘);
background-repeat: no-repeat;
background-position:left;
}
#navlist li{
list-style:none;
padding-left: 0px;
border-top: 1px dashed #E9e9e9;
}
#navcontainer a:link{
color: #0000FF;
text-decoration: none;
}
#navlist a:visited{
text-decoration: none;
}
#navcontainer a:hover{
color: #000000;
background-color: #fcee94;
}

Ich hab in deinem CSS auch kein border-style: dashed;
gefunden. Wo definierst du das denn?

So: border-top: 1px dashed #666;

Gruß
Kukuruz

#4

Hallo,

Dann solltest du padding- und margin-Werte aller Elemente, die
in deiner Navigation auftauchen, per Hand setzen, damit keine
Browserspezifischen Defaults verwendet werden.

Das verstehe ich jetzt nicht, wie per Hand?

Mit „von Hand“ meine ich eigentlich nur, dass du sie überhaupt setzen solltest.

:#navcontainer ul{


> margin-left: 0px;  
> padding-left: 0px;  
> font-family: Verdana, Arial;  
> font-size: 9pt  
> list-style-type:none;  
> }

Und du setzt du nur den link margin und padding, bei dem Rest verlässt du dich auf die Defaults. Und die sind Browserspezifisch.
Du könntest z.B. mit

margin: 0px;
padding: 0px;

anfangen und dann die Ränder wieder so vergrößern, wie du dir das vorstellst.

Grüße,
Moritz