Peter Mairhofer: Elemente zentrieren und verteilen

Hi,

Über einem div-Block *variabler* Breite möchte ich Registerkarten hingeben. Diese Registerkarten sollen jedoch in Summe die gleiche Breite einnehmen wie der div-Block. Die Abstände zwischen den Registerkarten sollen dabei konstant sein. Wie breit jeweils eine Registerkarte ist, ist egal, in Summe sollen sie jedoch so breit sein wie der div-Block. In HTML-Code:

<div id="container">

<ul id="registerkarten">
<li><a>Registerkarte 1</a></li>
<li><a>Registerkarte 2</a></li>
<li><a>Registerkarte 3</a></li>
</ul>

<div id="content">
Das ist der Inhalt
</div>

</div>

Also nochmal kurz beschrieben: Die Breite von "content" (und damit vom parent-Element "container") soll flexibel sein, je nachdem wieviel Platz ist.

Die ul's sollen zusammen mit den li's und den a's horizontale Registerkarten bilden, die in Summe gleich breit sind die "content". Ich müsste also Elemente gleichmäßig "verteilen" können.

Ich hoffe ihr versteht was ich meine.

Wie kann man sowas in CSS implementieren?

lg,
Peter

  1. Wie kann man sowas in CSS implementieren?

    wenn du die anzahl der elemente kennst ist es kein problem

    breite der registerkarte elements = gesamtbreite / anzahl der elemente

    anahme du hast eine breite von 300 pixel und drei elemente

    300 = 100%
    100% / 3 = 33.33%