CSS: Anordnung von DIV Elementen
-
hier mein HTML Code:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html> <head> <title>Test</title> <link rel="stylesheet" media="screen,projection" title="Standardstylesheet" href="stylesheets/default.css" type="text/css" /> </head <body> <div id="menu"> <div id="menuleft">links</div> <div id="menucenter"> <a href="#">Links1</a> | <a href="#">Links2</a> </div> <div id="menuright">rechts</div> </div> <div id="content"> <p>asfdsf sddsf dsfssdfs sdf ghgsdf fgsdfsd fsf sdfdsf sdf sdfsdf sdf sdf ein.</p> <p>dsf dsfssdfs sdf ghgsdf fgsdfsd fsf sdfdsf sdf sdfsdf .</p> <p>dsf dsfssdfs sdf ghgsddsf dsfssdfs sdf ghgsdf fgsdfsd fsf sdfdsf sdf sdfsdf sdfdsf sdf sdfsdf .</p> <p>dsf dsfssdfs sdf ghgsdf fgsdfsd fsf sdfdsf sdf sdfsdf dsf dsfssdfs sdf ghgdsf dsfssdfs sdf ghgsdf fgsdfsd fsf sdfdsf sdf sdfsdf dfsdf </p> </div> </body> </html>
hier noch das CSS:
#header { margin: 0px auto 0 auto; width:1000px; background: rgb(67,67,67); border:3px solid rgb(67,67,67); } #content { margin: 0px auto 0 auto; width:1000px; background: rgb(255,255,255); border:1px solid rgb(67,67,67); } #menu { width:1000px; margin: 0px auto 0 auto; background: rgb(67,67,67); border:1px solid rgb(67,67,67); } #menuleft { width:50px; margin:0 0px 0 0; padding:0px; float:left; } #menucenter { width:500px; margin:0 0px 0 0; padding:0px; float:center; } #menuright { width:50px; margin:0 0px 0 0; padding:0px; float:right; } .clear { clear:left; }
Mein Menü gliedert sich in drei Bereiche: Links (#menuleft), Mitte (#menucenter), Rechts (#menuright)
das rechte Stück von meinem Menü wird aber immer in die nächste Zeile umgebrochen - kann man das irgendwie verhindern?
-
Es gibt kein
float: center
.
-
wie kann man dann ein Menü mochen, wo etwas links, etwas in der mitte und etwas rechts sein soll?
ich hätte das etwa so gemacht
<div id="menu"> <div id ="links"> </div> <div id ="mitte"> </div> <div id ="rechts"> </div> </div>
wie sieht das zugehörige CSS aus?
-
-
ah danke!