mein Problem ist folgendes. Ich habe innerhalb einer Haupt-Div-Box weitere Div Boxen für z.b. Header, Navigation, Menü und Inhalt (Footer auch, ist aber im moment ausgeklammert). Header ist ganz oben, mit Titel links neben dem Logo. Dann darunter eine Hauptnavigation. Darunter sollen dann zwei nebeneinander floatende Div Boxen mit links Menü und rechts Inhalt kommen. Sobald ich aber einer der Div Boxen die Formatierung float:right oder float:left gebe, erscheint sie in FireFox außerhalb der Haupt-Div-Box (im Internet Explorer funktioniert es). Ich habe so etwas ähnliches aber schon häufiger gemacht und da hat es auch immer in Fire Fox funktioniert.
Ich frage mich jetzt, was mache ich hierbei falsch, was übersehe ich. Wäre schön, wenn ihr mir weiterhelfen könntet.
Der Link, um den sich das Problem handelt: Layout
Der Quellcode lautet:
PHP-Quellcode
- <?php
- error_reporting(E_ALL);
- include "inc/config/config.php";
- echo "<!DOCTYPE html PUBLIC \"-//W3C//DTD XHTML 1.0 Strict //EN\" \"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd\">\n";
- echo "<html xmlns=\"http://www.w3.org/1999/xhtml\" xml:lang=\"de\" lang=\"de\">\n";
- echo " <head>\n";
- echo " <meta http-equiv=\"content-type\" content=\"text/html; charset=utf-8\" />\n";
- echo " <link rel=\"stylesheet\" type=\"text/css\" href=\"css/clan1.css\">\n";
- echo " <title>CS:S Clanpage des -X- Clans</title>\n";
- echo " <meta name=\"author-personal\" content=\"Kevin Klein\" />\n";
- echo " <meta name=\"author-mail\" content=\"mailto:Sicef@web.de\" />\n";
- echo " <meta name=\"description\" content=\"Counter Strike Source Clanpage des -X- Clans\" />\n";
- echo " </head>\n";
- echo " <body style=\"text-align:center;\">\n";
- echo " <div id=\"main\">\n";
- echo " <div id=\"header\">\n";
- include "inc/main/header.php";
- echo " </div>\n";
- echo " <div id=\"navi\">\n";
- include "inc/main/navi.php";
- echo " </div>\n";
- echo " <div id=\"menu\">\n";
- include "inc/main/menu.php";
- echo " </div>\n";
- echo " <div id=\"content\">\n";
- include "inc/main/content.php";
- echo " </div>\n";
- echo " </div>\n";
- /*echo " <div id=\"footer\">\n";
- include "inc/main/footer.php";
- echo " </div>\n";*/
- echo " </body>\n";
- echo "</html>\n";
- ?>
und die css Formatierung:
HTML-Quellcode
- /* Haupt ID's # */
- #main {
- text-align: left;
- margin: 0px auto;
- width: 780px;
- border: 1px solid black;
- }
- #header {
- height: 108px;
- }
- #navi {
- border-top: 1px solid black;
- /*width: 50%;*/
- margin: 0px auto;
- padding-top: 5px;
- padding-bottom: 5px;
- }
- #menu {
- width: 120px;
- border: 1px solid black;
- }
- #content {
- float: right;
- width: 610px;
- /*padding: 0px 10px;*/
- border: 1px solid black;
- }
- #footer {
- text-align: left;
- margin: 10px auto;
- width: 780px;
- border: 1px solid black;
- float: left;
- }
- /* Styles für header */
- #title {
- height: 24px;
- padding-top: 40px;
- }
- #banner {
- float: right;
- height: 108px;
- width: 320px;
- }
- /* Styles für Navi */
- .navi {
- float: left;
- width: 24%;
- text-align:center;
- margin: 0px auto;
- }
- .link {
- }
Ich hoffe, dass damit alle Infos gegeben sind. Falls noch Fragen offen stehen, stellt sie bitte.
Danke im Vorraus.
MfG
Kevin
Edit: Durch Zufallsexperimentieren habe ich herausgefunden, dass am Ende des Quelltextes ein clear: both das Problem löst. Aber leider habe ich keine Ahnung wieso und weshalb, also wenn mir das vielleicht jemand erklären könnte, wäre es wirklich nett!!