Nav-Menü erstellen Ein Nav-Objekt ist größer als die Höhe des Containers

Question

Ich habe eine Navigation (Sample Wireframe), die einen farbigen Hintergrund hat. Die Navigationselemente befinden sich in einer Liste und in verschiedenen Auflösungen. Wenn sich die Schriftgröße ändert, wird die Höhe des Navigationscontainers ebenfalls erweitert oder kontrahiert. Ich möchte jedoch, dass eines dieser Objekte (das mittlere) eine größere Höhe hat und die Grenzen des Containers bricht.

Ist der sauberste Weg, dies zu tun, um die Höhe des Containers auf die Höhe der anderen Tasten mit Javascript zu setzen, oder wird das immer noch die größere Nav Element abschneiden? Ich kann nicht scheinen, eines der Elemente aus den Grenzen des Containers auszubrechen, ohne eine absolute Positionierung vorzunehmen, die es vollständig aus dem Fluss der anderen Listenelemente herausnimmt, und ich möchte, dass die Höhe des Containers mit dem Rest konsistent bleibt der Tasten. Irgendwelche Gedanken?

Answer 1

Erstellen Sie den Artikel mit position:absolute als Stileigenschaft festgelegt.

Möglicherweise müssen Sie ein weiteres Element daneben mit der regulären Höhe erstellen, die dahinter verborgen bleibt, damit die Breite reserviert bleibt.

Answer 2

position:absolute 

wird den Trick tun, sondern auch darüber nachdenken, ein extra div (geschachteltes div) zu haben, damit es von dem größeren Element isoliert.

Answer 3

Wie andere sagten, position: absolute. Es ist wichtig zu beachten, dass ein absolut positioniertes Element seinen Ursprungspunkt am nächsten Element mit position: relative (oder dem Wurzelelement) hat. Wenn Sie also den übergeordneten Container relativieren, wird der absolute Menüeintrag dort beginnen.