DIV'S ausrichten

19.07.2005, 14:17

Hallo zusammen,
ich möchte gerne meine Site in der Mitte des Bildschirms ausrichten.
Die Seite besteht aus 3 Teilen - Oben wird ein Banner included, Unten links ein Menü und unten rechts der Inhalt.
Leider bin ich blutiger Anfänger und habe schon einige Nerven daran gelassen. Ich habe ua versucht die index.php mit einem center-Tag zu umschliessen. Dabei werden mir aber Banner, Menü und Inhalt jeweils in der Mitte ausgerichtet. Banner und Menü sollen aber nebeneinander stehen und als gesamtes mittig sein.
Würde mich sehr über ne Antwort freuen, da ich alleine nicht mehr weiter komme!

Hier mal mein index.php:

<html>
<head>
<title>Test</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
</head>

<body>

<?php
error_reporting(E_ALL);
include "inc/config.php"; // die Konfigurationsdateien lesen.
echo "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Strict//EN\"\n";
echo " \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd\">\n";
echo "<html>\n";
echo " <head>\n";
echo " <title>Meine Seite</title>\n";
echo " <link rel=\"stylesheet\" type=\"text/css\" href=\"page.css\" />\n";
echo " <meta http-equiv=\"Content-Type\"
content=\"text/html; charset=ISO-8859-1\" />\n";
echo " </head>\n";
echo " <body>\n";
echo " <div id=\"root\">\n"; // ganz oberer Div-Holder
echo " <div id=\"banner\">\n"; // banner
include "banner.php";
echo " </div>\n";
echo " <div id=\"links\">\n"; // linkes Menu
include "menu.php";
echo " </div>\n";
echo " <div id=\"mitte\">\n"; // In der Mitte der Inhalt
include "inhalt.php";
echo " </div>\n";
echo " <br style=\"clear:both;\" />\n"; // css-float beenden
echo " </div>\n";
echo " </body>\n";
echo "</html>\n";
?>

</body>
</html>

hekto · 19.07.2005, 14:21

www.css4you.de
dort mal nachschauen

19.07.2005, 15:14

Danke für die Antwort. Bin jedoch noch nicht wirklich weitergekommen.
Auf der Seite habe ich etwas von Eltern-Elementen gelesen - kann's sein, dass ich auch noch #root definieren muss?

#banner {
height: 80px;
}
#links {
width: 30%;
float: left;
}
#mitte {
width: 69%;
float:left;
}

jakobwenzel · 19.07.2005, 17:27

Mustt du eigentlich nicht (Ich kenn mich aber nicht soooooooo gut aus)(Nein, meine O-Taste klemmt nicht)

derHund · 19.07.2005, 18:02

doch, wenn du zentrieren willst, mußt du das für root machen, der kapselt ja (offenbar) deine bereiche.

poste bitte nächstes mal den html-code, danke.

19.07.2005, 19:15

Lies Dir das hier mal durch:

http://www.thestyleworks.de/tut-art/centerblock.shtml

20.07.2005, 16:44

habe meine komplette css-Datei nochmals auf'n Kopf gestellt....dabei brachte mich der Link von PaterNoster auch fast ans Ziel.
Leider wird mir momentan die Site bei jeder Fenstergrösse auf die horizontale Mitte ausgerichtet.
Ich hätte es aber gerne so: Wenn das Browserfenster kleiner gezogen wird als meine Site, so soll die Site linksbündig sein.
sieht momentan so aus: www.topfass-aichstetten.de/datatec
...hoffe das kommt einigermassen verständlich rüber!

meine jetzige css:

body {
font-family: serif;
font-size: 15px;
background-color: #fff;
color: #000;
padding: 0;
margin: 0;
text-align: center;

}
HTML>body {
padding: 0;
}

#root {
position:absolute;
left: 50%;
width: 500px;
text-align: center;
margin-left: -400px;
}

#banner {
padding: 0;
border: 1px solid #FFFFFF;
margin: 10px;
height: 95px;
}

#mitte {
padding: 0;
border: 1px solid #FFFFFF;
margin: 10px 10px 10px 150px;
}

#links {
background: #FFFFFF;
padding: 0;
border: 1px solid #FFFFFF;
margin: 7px;
width: 130px;
top: 96px;
position: absolute;
left: 0;
}

agrajag · 20.07.2005, 16:52

Der Beitrag wurde verschoben, wegen...
... Postings im falschen Forum. Bitte beim nächsten Mal darauf achten..

moved to (X)HTML, CSS & JavaScript

Themen-Optionen
Druckbare Version zeigen Jemanden per E-Mail auf dieses Thema hinweisen
Thema bewerten
Thema bewerten:

Ähnliche Themen
Thema	Autor	Forum	Antworten	Letzter Beitrag
DIVs nebeneinander?	wers1	HTML, Usability und Barrierefreiheit	13	18.07.2008 14:26
[JS] Divs nach Datum sortieren	cycap	JavaScript, Ajax und mehr	24	16.07.2008 18:48
2 Div's zentrieren	pfump	HTML, Usability und Barrierefreiheit	7	24.04.2008 10:57
Formular mit DIVs	Aris Sung	HTML, Usability und Barrierefreiheit	2	25.11.2007 14:09
Dynamisches Container-Div für floating Divs	HStev	HTML, Usability und Barrierefreiheit	1	14.09.2007 12:39
DIV's untereinander -> Problem	snatch-ic	HTML, Usability und Barrierefreiheit	1	05.02.2007 12:39
Spaltendesign mit DIVs	HStev	HTML, Usability und Barrierefreiheit	4	12.06.2006 12:29
3 divs nebeneinander mit dynamisch gleicher Höhe		HTML, Usability und Barrierefreiheit	19	18.01.2006 22:05
DIVs auf "echte" 100% der Seite setzen?	King2k	HTML, Usability und Barrierefreiheit	3	07.12.2005 15:15
Firefox + Divs	Anubis2183	HTML, Usability und Barrierefreiheit	10	28.05.2005 16:33
DIVs nebeneinander	freitz	HTML, Usability und Barrierefreiheit	4	21.04.2005 22:47
[Erledigt] drei divs nebeneinander		HTML, Usability und Barrierefreiheit	5	10.01.2005 20:27
Verschachtelung von DIV's bei unterschiedlichen Auflösungen		HTML, Usability und Barrierefreiheit	8	24.12.2004 14:45
ausrichten was css betrifft		HTML, Usability und Barrierefreiheit	15	12.11.2004 11:06
mehrere gleichnamige DIVs möglich?		HTML, Usability und Barrierefreiheit	6	26.08.2004 11:56

19.07.2005, 14:17
Gast Beiträge: n/a	DIV'S ausrichten Hallo zusammen, ich möchte gerne meine Site in der Mitte des Bildschirms ausrichten. Die Seite besteht aus 3 Teilen - Oben wird ein Banner included, Unten links ein Menü und unten rechts der Inhalt. Leider bin ich blutiger Anfänger und habe schon einige Nerven daran gelassen. Ich habe ua versucht die index.php mit einem center-Tag zu umschliessen. Dabei werden mir aber Banner, Menü und Inhalt jeweils in der Mitte ausgerichtet. Banner und Menü sollen aber nebeneinander stehen und als gesamtes mittig sein. Würde mich sehr über ne Antwort freuen, da ich alleine nicht mehr weiter komme! Hier mal mein index.php: <html> <head> <title>Test</title> <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1"> </head> <body> <?php error_reporting(E_ALL); include "inc/config.php"; // die Konfigurationsdateien lesen. echo "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Strict//EN\"\n"; echo " \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd\">\n"; echo "<html>\n"; echo " <head>\n"; echo " <title>Meine Seite</title>\n"; echo " <link rel=\"stylesheet\" type=\"text/css\" href=\"page.css\" />\n"; echo " <meta http-equiv=\"Content-Type\" content=\"text/html; charset=ISO-8859-1\" />\n"; echo " </head>\n"; echo " <body>\n"; echo " <div id=\"root\">\n"; // ganz oberer Div-Holder echo " <div id=\"banner\">\n"; // banner include "banner.php"; echo " </div>\n"; echo " <div id=\"links\">\n"; // linkes Menu include "menu.php"; echo " </div>\n"; echo " <div id=\"mitte\">\n"; // In der Mitte der Inhalt include "inhalt.php"; echo " </div>\n"; echo " <br style=\"clear:both;\" />\n"; // css-float beenden echo " </div>\n"; echo " </body>\n"; echo "</html>\n"; ?> </body> </html>


Mister Ad PHP Code Flüsterer Registriert seit: 21.08.2005 Beiträge: 4682 PHP-Kenntnisse: Fortgeschritten

19.07.2005, 14:21
hekto Erfahrener Benutzer Registriert seit: 06.01.2005 Beiträge: 308	www.css4you.de dort mal nachschauen __________________ Gruß Hekto

19.07.2005, 15:14
Gast Beiträge: n/a	Danke für die Antwort. Bin jedoch noch nicht wirklich weitergekommen. Auf der Seite habe ich etwas von Eltern-Elementen gelesen - kann's sein, dass ich auch noch #root definieren muss? #banner { height: 80px; } #links { width: 30%; float: left; } #mitte { width: 69%; float:left; }

19.07.2005, 17:27
jakobwenzel Neuer Benutzer Registriert seit: 14.07.2005 Beiträge: 28 PHP-Kenntnisse: Fortgeschritten	Mustt du eigentlich nicht (Ich kenn mich aber nicht soooooooo gut aus)(Nein, meine O-Taste klemmt nicht) __________________ Dies ist ein Text, der an jeden Beitrag von dir angehängt werden kann. Es besteht ein Limit von 150 Buchstaben.

19.07.2005, 18:02
derHund Erfahrener Benutzer Registriert seit: 29.10.2004 Beiträge: 1.781	doch, wenn du zentrieren willst, mußt du das für root machen, der kapselt ja (offenbar) deine bereiche. poste bitte nächstes mal den html-code, danke. __________________

19.07.2005, 19:15
Gast Beiträge: n/a	Lies Dir das hier mal durch: http://www.thestyleworks.de/tut-art/centerblock.shtml

20.07.2005, 16:44
Gast Beiträge: n/a	habe meine komplette css-Datei nochmals auf'n Kopf gestellt....dabei brachte mich der Link von PaterNoster auch fast ans Ziel. Leider wird mir momentan die Site bei jeder Fenstergrösse auf die horizontale Mitte ausgerichtet. Ich hätte es aber gerne so: Wenn das Browserfenster kleiner gezogen wird als meine Site, so soll die Site linksbündig sein. sieht momentan so aus: www.topfass-aichstetten.de/datatec ...hoffe das kommt einigermassen verständlich rüber! meine jetzige css: body { font-family: serif; font-size: 15px; background-color: #fff; color: #000; padding: 0; margin: 0; text-align: center; } HTML>body { padding: 0; } #root { position:absolute; left: 50%; width: 500px; text-align: center; margin-left: -400px; } #banner { padding: 0; border: 1px solid #FFFFFF; margin: 10px; height: 95px; } #mitte { padding: 0; border: 1px solid #FFFFFF; margin: 10px 10px 10px 150px; } #links { background: #FFFFFF; padding: 0; border: 1px solid #FFFFFF; margin: 7px; width: 130px; top: 96px; position: absolute; left: 0; }

20.07.2005, 16:52
agrajag Moderator Registriert seit: 02.10.2006 Beiträge: 3.820 PHP-Kenntnisse: Fortgeschritten	Der Beitrag wurde verschoben, wegen... ... Postings im falschen Forum. Bitte beim nächsten Mal darauf achten.. moved to (X)HTML, CSS & JavaScript __________________ Today you...Tomorrow me.