Navigationsbox mit zwei gleich langen Zeilen

[css-neuling]

Hallo zusammen! Als ersten Post in diesem Forum wage ich gleich eine Frage zu stellen. Hoffentlich könnt ihr mir bei einem CSS-Problem helfen (bin ambitionierter Laie).

Auf meiner Seite soll eine Navigationsbox auftauchen, die aus zwei Zeilen besteht. Die obere Zeile enthält vier Links (als ul ohne Aufzählungspunkte realisiert). Die untere Zeile soll ein Suchformular enthalten, bestehend aus einem Eingabefeld und einem „Suchen“-Button.

Jetzt das Problem: Ich möchte, dass die untere Zeile exakt gleich lang ist wie die obere Zeile (siehe Bild), dabei würde ich aber gerne absolute Größenvorgaben vermeiden. Oder sind solche zwingend erforderlich?

Meine bisherige Idee war: Ein div-Container, der zwei weitere Container enthält (obere und untere Zeile). Beide Zeilen übernehmen aber entweder die fixe Breite des äußeren Containers (möchte ich vermeiden, da absolut angegebene Breite) oder sind unterschiedlich breit…

Für jeden Tip wäre ich dankbar!

[ThomaZ]

Wenn ich dich richtig verstehe, dann hilft dir folgendes:

Einen Conteiner drum herum war schonmal gut. Wenn er seine Breite schon fix hat, auch gut.

Code: Alles auswählen

<div id="aussen">
     <div class="zeile">blah blah</div>
     <div class="zeile">suche</div>
</div>


Dann gubst du den Zeilen einfach die breite des containers:

Code: Alles auswählen

div[class="zeile"]   {
   position:      relative;
    top:         0;
    left:         0;
    right:         0;
}


Das müsste klappen (habs jetzt nicht getestet)



MfG

ThomaZ