• Jetzt anmelden. Es dauert nur 2 Minuten und ist kostenlos!

CSS Width automatische Anpassung an Box-Breite

soigroeg

Neues Mitglied
Hallo Leute,

ich hab in einer Box ein Menü. Die Box hat ca. 600 px.

Ich möchte, dass ein Menüitem nun relativ zu den anderen Items eine bestimmte Größe annimmt.

z.B. wenn ich 3 Menüpunkte habe, dass jeder Menüpunkt 200px breit wird. Wenn ich ein Menüpunkt hinzufüge und 4 habe, dann soll jeder Menüpunkt 150px breit werden.

Im Moment sehe ich nur die Möglichkeit jedesmal die absoluten Größen im Temple anzupassen... was recht umständlich ist. Gibt es da eine Alternative? Die Seite kann man übrigens hier finden:

Home
 
Das geht auch mit % Werten, aber ob das 33% bei 3 Menüpunkten oder 25% bei 4 Punkten sein müsssen weisst du damit immer noch nicht.
Ich löse solche Sachen mit einer globalen Variablen, aber ich habe davon gleich eine ganze Menge darum mache ich das alles mit PHP.

Code:
// ganz oben im Script
// oder noch besser 
// in einer separaten Datei
// zum includen

$menu_spaltenbreite = "150px";

// dann brauchst du im Menü nur noch

<?php echo $menu_spaltenbreite; ?>

Bei Änderungen musst du dann nur noch diese eine Variable ändern und der Rest geht automatisch.
 
Oder so
Code:
<!DOCTYPE html>

<html lang="en">
<head>
<meta charset="UTF-8" />
<title>navi</title>
<style>

* {
 margin:0;
 padding:0;
 list-style:none;
 text-decoration:none;
}

ul {
 float:left;
 width:100%;
 text-align:center;
 display:table;
}

li {
 display:table-cell;
 background:#aaa;
}

li:nth-child(odd) {
 background:#ada;
}

</style>
</head>
<body>
  <ul> 
   <li><a href="#">Link 1</a></li>
   <li><a href="#">Link 2</a></li>
   <li><a href="#">Link 3</a></li>
   <li><a href="#">Link 4</a></li>
  </ul>
  
</body>
</html>
 
Zurück
Oben