Hallo,
ich baue mir ein top menu und hab folgendes Problem:
Elemente von lv2 werden als flex dargestellt, mit wrap:
Ich möchte das das sub auf die volle Breite dargestellt wird ... direkt unter dem Hauptmenü Punkte.
Also hbe ich "position: absolute;" genommen ... das passt, da ich in einem anderen element die fixe Höhe ovn "50px" zuweise.
aber;
wenn das Top menu umbricht, sollte natürlich ein Subelement weiter unten dargestellt werden.
Wie kann ich das erreichen? Ich müsste das ".sub" direkt unter dem <li> element anzeigen.
Danke!
ich baue mir ein top menu und hab folgendes Problem:
HTML:
<ul class="lv2">
<li><a href="#"><img src="https://via.placeholder.com/80x30.png?text=cat">item 1 von all otheggggggggggggggggggggggggggggggr</a>
<ul class="sub lv3">
<li><a href="#">
<img src="https://via.placeholder.com/30x30.png?text=cat">
item 1.1ggggggggggggggggggggggggggggggggggg</a></li>
<li><a href="#">item 1.1</a></li>
<li><a href="#">item 1.1</a></li>
Elemente von lv2 werden als flex dargestellt, mit wrap:
CSS:
.lv2,
.lv3_d {
display: flex;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
align-items: stretch;
align-content: center;
list-style: none;
}
.sub {
display: none;
flex-direction: row;
flex-wrap: wrap;
justify-content: center;
align-items: stretch;
align-content: center;
list-style: none;
width: 100%;
position: absolute;
left: 0px;
background: white;
padding-top: 10px;
padding-left: 10px;
}
Ich möchte das das sub auf die volle Breite dargestellt wird ... direkt unter dem Hauptmenü Punkte.
Also hbe ich "position: absolute;" genommen ... das passt, da ich in einem anderen element die fixe Höhe ovn "50px" zuweise.
aber;
wenn das Top menu umbricht, sollte natürlich ein Subelement weiter unten dargestellt werden.
Wie kann ich das erreichen? Ich müsste das ".sub" direkt unter dem <li> element anzeigen.
Danke!