Border in Listen

[Tina]

Guten Tag

Es geht um folgendes: ich habe ein verschachteltes Menü in Listenform. Den uls ist jeweils per CSS oben und unten eine 1px-Border zugewiesen.

Das Problem ist nun, dass, wenn sich mehrere uls direkt hintereinander schliessen (s. Codebeispiel unten), im IE 5.0 alle unteren Border angezeigt werden (hier also eine 3px-Linie) und im IE 5.5 und 6 eine 2px-Linie, wovon die untere rechts einen Pixel zu kurz ist.

Im Firefox werden - wie gewünscht - die Linien zu einer 1px-Border zusammengezogen. Gibt es eine Möglichkeit, auch die IEs
dazu zu bringen?

Vielen Dank für eure Hilfe
lieben Gruß
Tina

<ul id="navi_level_1">
  <li><a href="#">Level 1</a></li>
  <li><a href="#">Level 1</a>
    <ul id="navi_level_2">
      <li><a href="#">Level 2</a></li>
      <li><a href="#">Level 2</a>
 <ul id="navi_level_3">
   <li><a href="#">Level 3</a></li>
   <li><a href="#">Level 3</a>
            <ul id="navi_level_4">
       <li><a href="#">Level 4</a></li>
     </ul>
   </li>
 </ul>
      </li>
    </ul>
  </li>
  <li><a href="#">Level1</a></li>
</ul>

[Facetious]

Hallo!

Ich glaube das kann man über die css eigenschaft:
border-collapse steuern:

also border-collapse: collapse;

ich hoffe das stimmt und ich kann helfen
mfg Facetious

Guten Tag

Es geht um folgendes: ich habe ein verschachteltes Menü in Listenform. Den uls ist jeweils per CSS oben und unten eine 1px-Border zugewiesen.

Das Problem ist nun, dass, wenn sich mehrere uls direkt hintereinander schliessen (s. Codebeispiel unten), im IE 5.0 alle unteren Border angezeigt werden (hier also eine 3px-Linie) und im IE 5.5 und 6 eine 2px-Linie, wovon die untere rechts einen Pixel zu kurz ist.

Im Firefox werden - wie gewünscht - die Linien zu einer 1px-Border zusammengezogen. Gibt es eine Möglichkeit, auch die IEs
dazu zu bringen?

Vielen Dank für eure Hilfe
lieben Gruß
Tina

<ul id="navi_level_1">
  <li><a href="#">Level 1</a></li>
  <li><a href="#">Level 1</a>
    <ul id="navi_level_2">
      <li><a href="#">Level 2</a></li>
      <li><a href="#">Level 2</a>
<ul id="navi_level_3">
   <li><a href="#">Level 3</a></li>
   <li><a href="#">Level 3</a>
            <ul id="navi_level_4">
       <li><a href="#">Level 4</a></li>
     </ul>
   </li>
</ul>
      </li>
    </ul>
  </li>
  <li><a href="#">Level1</a></li>
</ul>

[tina]

also border-collapse: collapse;

Hallo Facetious,

daran hatte ich gedacht - hat aber keinen Effekt Ich nehme an, dass das nur bei Tabellen geht.

Danke und Gruß
Tina

[Maxx]

Hallo Tina,

wenn sich mehrere uls direkt hintereinander schliessen im IE 5.0 alle unteren Border angezeigt werden (hier also eine 3px-Linie)

das erscheint mir logisch

im IE 5.5 und 6 eine 2px-Linie

dann fehlt eine border

Im Firefox werden - wie gewünscht - die Linien zu einer 1px-Border zusammengezogen.

ich weis nicht so recht. Macht der FF da nicht einen Fehler?
Die vorhandenen Informationen sind etwas dürftig. Hast du etwas online zum gucken? Mit deinem Beispiel erhalte ich sowohl im IE6, also auch im FF eine 3px Linie.

[tina]

ich weis nicht so recht. Macht der FF da nicht einen Fehler?
Die vorhandenen Informationen sind etwas dürftig. Hast du etwas online zum gucken? Mit deinem Beispiel erhalte ich sowohl im IE6, also auch im FF eine 3px Linie.

Hallo Maxx,

meinst du? Ich habe jetzt mal das Menü online gestellt, der Einfachheit halber mit dem entsprechenden CSS im Head.

lG
Tina

[Der Martin]

Hallo Tina,

Mit deinem Beispiel erhalte ich sowohl im IE6, also auch im FF eine 3px Linie.

ich habe mir gerade dein Online-Beispiel mit dem IE5.5 angeschaut und sehe auch nur ein 2px-Border. (Es geht doch z.B. um den Übergang von Level4 zu Level1, oder?)

Im Gegensatz zu deiner Beschreibung sind aber beide Rahmenlinien exakt gleich lang. Sie schießen links und rechts bündig miteinander ab, so als ob es tatsächlich nur *eine* Linie mit 2px Breite wäre.

So long,

Martin

[Maxx]

Hallo Tina,

Ich habe jetzt mal das Menü online gestellt, der Einfachheit halber mit dem entsprechenden CSS im Head.
http://www.triplesense.de/pc_test/test.html

ja, wobei das CSS doch _deutlich_ umfangreicher ist als nur ein ul mit border.

Ich hatte es bereits erwähnt. Ein:

ul { border-top:1px solid red;
     border-bottom:1px solid black;}

macht im IE6, FF1.0.4 und Opera 7.54 eine 3px Linie.
Der Beweis

Der "Fehler" wird sich wohl irgendwo tiefer in deinem CSS verbergen.

Grüße,

Jochen