Zur Navigation

Menü Umbruch

1 Benny

Und schon stehe ich vor dem nächsten Problem:

wie krieg ich es hin, dass er mit die einzelnen menüpunkte beim verkleinern des fensters nicht untereinander stapelt? muss ich für jeden punkt ein extra div erstellen, geht das ganze auch in einem div? ich möchte auf jeden fall allein fürs menü ein extra div haben, jetzt ist die frage, muss ich alle punkte in ein div schreiben oder für jede grafik ein extra div, was mir blödsinnig erscheint, da nehm ich ja dann leichter ne tabelle, aber wie krieg ich das hin ohne dass er mir nen zeilenumbruch macht wenn ich das fenster verkleinere?

http://www.bstanger.de/fertig/

Benjamin

werde auf jeden fall deine forensoftware einbinden, die ist ja mal große klasse, genau das was ich suche, nicht vollgestopft mit unsinnigem gedönse wie etwa das burning board oder ne andere software, nur das wichtigste drin, alles schön einfach, flexibel, übersichtlich, so muss das sein!!

16.07.2007 21:44 | geändert: 16.07.2007 21:45

2 Jörg Kruse

Hallo Benjamin,

wenn du #menue eine feste Breite zuweist, die min. der Gesamtbreite der Buttons entspricht, kommt es darin nicht zum Umbruch. Zentrieren kannst du dieses Element über margin:auto. Für den dümmeren IE wird noch ein text-align:center im body benötigt (welches du in Textelementen durch ein text-align:left wieder aufheben kannst).

body {
margin:0;
padding:0;
background-image:url(images/verlauf.gif);
background-repeat:repeat-x;
text-align:center;
}
#logo {
margin-top:60px;
}

#menue {
margin-left:auto;
margin-right:auto;
width:390px;
}

Auf die <br>s kannst du übrigens auch verzichten, indem du #menue ein passendes margin-top zuweist (sowie bei #logo)

17.07.2007 08:50 | geändert: 17.07.2007 08:52

3 Benny

Hallo Jörg!

So, möchte einmal meinen Dank aussprechen, hat alles wunderbar geklappt. Möchte jetzt nur unter das graue Quadrat (gleichzeitig rechts neben das grüne Rechteck ein 2. genauso großes graues Quadrat. Möchte Außerdem in das grüne einen Text schreiben siehe hier:

http://www.bstanger.de

wer aber in den Code linst wird feststellen, dass diese Lösung absolut rubbish ist ;). Das ist wohl nicht w3c valid ;).

Wie mach ich das besser?

Würde mich über eine weitere Antwort sehr freuen!

Gruß Benjamin

17.07.2007 23:17

4 Jörg Kruse

Du kannst die Blöcke mithilfe von float nebeneinander anordnen, wobei du den float am Ende durch ein clear wieder aufheben musst. Pack die Blöcke am besten in einen äußeren Container (im Beispiel #wrapper), den du dann zentrierst.

Aufbau im CSS:
body {
text-align:center;
}
#wrapper {
width:808px;
margin:auto;
text-align:left;
}
#gruen {
width:400px;
height:800px;
float:left;
background-image:url(rechteck.jpg);
}
#bild {
width:400px;
height:400px;
float:right;
background-image:url(quadrat3.jpg);
}
#grau {
width:400px;
height:400px;
float:right;
background-image:url(quadrat.jpg);
}

Aufbau des HTML:
<div id="wrapper">
<div id="gruen"></div>
<div id="bild"></div>
<div id="grau"></div>
<br style="clear:both">
</div>

18.07.2007 10:36 | geändert: 18.07.2007 10:37

Beitrag schreiben (als Gast)

Die Antwort wird nach der Überprüfung durch einen Moderator freigeschaltet.





[BBCode-Hilfe]