Listmenu Submenü Border

[Detlef G.]

Hallo Andreas

So soll es aussehen:

Auch wenn das dein Borderproblem noch nicht löst, das HTML stimmt nicht.

<div id="linksmenu">
<ul id="linkslist">

<li><a href="#">Link1 Hauptmenü</a></li>

<li><a href="#">Link2 Hauptmenü</a></li>

<ul id="linkssublist">

UL darf nicht Kind von UL sein, die id ist auch nicht nötig, weil sie sich leicht über den Nachfahrenselektor ansprechen lässt.

<li><a href="#">Link1 Untermenü</a></li>
    <li><a href="#">Link2 Untermenü</a></li>
    <li><a href="#">Link3 Untermenü</a></li>
    <li><a href="#">Link4 Untermenü</a></li>
  </ul>

Oh, noch ein Hauptmenü?

<ul id="hauptmenue">

<li><a href="#">Link3 Hauptmenü</a></li>

</ul>
</div>

Meinst du so?

<div id="linksmenu">  
 <ul id="linkslist">  
  <li><a href="#">Link1 Hauptmenü</a></li>  
  <li><a href="#">Link2 Hauptmenü</a>  
   <ul>  
    <li><a href="#">Link1 Untermenü</a></li>  
    <li><a href="#">Link2 Untermenü</a></li>  
    <li><a href="#">Link3 Untermenü</a></li>  
    <li><a href="#">Link4 Untermenü</a></li>  
   </ul>  
  </li>  
  <li><a href="#">Link3 Hauptmenü</a></li>  
 </ul>  
</div>

so sieht es momentan aus

Menu_1

SubMenu_1
  SubMenu_2
  SubMenu_3

Border hier fehlt

Vielleicht mit:

#linkslist ul {  
  border-bottom:1px solid #0000cc;  
}  

~~~»»  

> menu\_2  
> -------------  
  
oder:  
~~~css
#linkslist a {  
 /* das Bisherige und zusätzlich */  
 border-top:1px solid #0000cc;  
 margin-top:-1px;  
}  
#linkslist ul a{  
 /* das Bisherige und zusätzlich */  
 border-top:none;  
 margin-top:0;  
}  

Ich habe aber noch keine Vorstellung davon, wie das Menü dann im IE aussehen soll.

Auf Wiederlesen
Detlef