Ich möchte mit divs eine Navigation erstellen. Die Navigation soll horizontal ausgerichtet sein und 5 Buttons haben.
Jetzt das Problem: Ich möchte das ganze mit divs machen (falls das geht).
Sagen wir, ich habe eine Auflösung von 800 x 600. Ich möchte, dass jeder Button 50 pixel lang ist. Mit "float:left;" erreiche ich, dass die 5 divs hintereinander stehen. Aber wie krieg ich die jetzt mittig für JEDE Auflösung.
Klar kann ich jetzt ein div links hin machen, was 275 pixel lang ist. Aber das ist dann halt nur für die auflösung 800x600.
Bin ein Neuling auf dem Gebiet mit divs. Mit CSS und HTML kenn ich mich aber an sonsten aus würde ich behaupten.
HTML - Datei:
<body id="body">
<center>
<div id="navi"> //Leiste die komplett durchs gesammte Bild geht ganz oben
<div id="float">a</div>
<div id="float">a</div>
<div id="float">a</div>
<div id="float">a</div>
<div id="float">a</div>
</div>
</center>
</body>
Ausgelagerte CSS - Datei:
#body
{
background:url(pics/verlauf.gif) repeat-x; (Hintergrundbildung der Seite)
margin:0px;
}
#navi
{
background:url(pics/navi.gif) repeat-x; (Das ist der Hintergrund der Navigationsleiste)
width: 100%;
height: 41px;
text-align:center;
}
#float (Das sollen die Buttons werden)
{
background:#000000;
width: 50px;
height: 41 px;
float:left;
}
Jetzt das Problem: Ich möchte das ganze mit divs machen (falls das geht).
Sagen wir, ich habe eine Auflösung von 800 x 600. Ich möchte, dass jeder Button 50 pixel lang ist. Mit "float:left;" erreiche ich, dass die 5 divs hintereinander stehen. Aber wie krieg ich die jetzt mittig für JEDE Auflösung.
Klar kann ich jetzt ein div links hin machen, was 275 pixel lang ist. Aber das ist dann halt nur für die auflösung 800x600.
Bin ein Neuling auf dem Gebiet mit divs. Mit CSS und HTML kenn ich mich aber an sonsten aus würde ich behaupten.
HTML - Datei:
<body id="body">
<center>
<div id="navi"> //Leiste die komplett durchs gesammte Bild geht ganz oben
<div id="float">a</div>
<div id="float">a</div>
<div id="float">a</div>
<div id="float">a</div>
<div id="float">a</div>
</div>
</center>
</body>
Ausgelagerte CSS - Datei:
#body
{
background:url(pics/verlauf.gif) repeat-x; (Hintergrundbildung der Seite)
margin:0px;
}
#navi
{
background:url(pics/navi.gif) repeat-x; (Das ist der Hintergrund der Navigationsleiste)
width: 100%;
height: 41px;
text-align:center;
}
#float (Das sollen die Buttons werden)
{
background:#000000;
width: 50px;
height: 41 px;
float:left;
}