|
 |
  |
| Autor |
Nachricht |
$nick = Chris;
Neuer [User]
Anmeldung: 02.09.08
Beiträge: 8
|
 Verfasst am: 03.09.2008, 20:15 Titel: Problem mit 3 Zeilen-Layout |
 |
|
Hallo zusammen!
Ich hoffe einmal, dass meine Frage noch nicht hier aufgetaucht ist.
Und zwar habe ich ein Problem mit dem 3-Zeilen-Layout meiner Website.
Hier erstmal das Bild zum Problem:  http://anspitzer.an.ohost.de/data/div-Fehler.png
Ich habe oben einen Bereich "space oben" und unten einen Bereich "space unten" eingerichtet, die die gesamte Bildschirmbreite umfassen. Dazwischen liegt ein div "Mitte", in dem sich drei weitere divs befinden. "Banner", "Navi" und "Content". Bei Banner und Navi kann ich die Höhe fest definieren, bei Content eben nicht.
Jetzt habe ich das Problem, dass der "space unten" nicht unterhalb des content-divs beginnt, sondern schon unter "navi" und unterhalb von content.
Habe mir schon ein Tutorial zu den faux columns durchgelesen. Aber die scheinen, wie ich daraus gelesen hab, nur für Spaltenlayouts geeignet.
Ich hoffe, mir kann wer eine Lösung zu dem Problem sagen.
|
|
| Nach oben |
|
 |
benjam4
Bekannter [Mod]
Anmeldung: 17.05.06
Beiträge: 1365
Wohnort: Ostfildern ...
|
| Verfasst am: 03.09.2008, 21:36 Titel: |
|
|
kannst du mal deinen code posten, so kann man das nicht so gut beurteilen, was du machen kannst.
_________________
Rechtschreibfehler sind beabsichtigt, sie dienen der Verschleiherung meiner tatsächlichen Genialität 
|
|
| Nach oben |
|
|
koellmania
Erfahrener [User]
Anmeldung: 09.04.08
Beiträge: 95
|
| Verfasst am: 03.09.2008, 22:37 Titel: |
|
|
ich bin mir nicht sicher, aber ich glaube ich weis wo dein problem liegt.
sieh dich mal bei selfhtml bzgl. css clear:left um, das müsste dein problem beheben.
|
|
| Nach oben |
|
|
chris1988
Bekannter [User]
Anmeldung: 12.12.05
Beiträge: 1688
|
| Verfasst am: 03.09.2008, 23:52 Titel: |
|
|
| Zitat: |
Habe mir schon ein Tutorial zu den faux columns durchgelesen. Aber die scheinen, wie ich daraus gelesen hab, nur für Spaltenlayouts geeignet. |
Der Mittlere Bereich bei dir ist doch ein 3-Spalten-Layout.
_________________
Mancher ertrinkt lieber,
als daß er um Hilfe ruft.
(Wilhelm Busch)
|
|
| Nach oben |
|
|
$nick = Chris;
Neuer [User]
Anmeldung: 02.09.08
Beiträge: 8
|
| Verfasst am: 05.09.2008, 21:26 Titel: |
|
|
| chris1988 hat folgendes geschrieben: | | Zitat: |
Habe mir schon ein Tutorial zu den faux columns durchgelesen. Aber die scheinen, wie ich daraus gelesen hab, nur für Spaltenlayouts geeignet. |
Der Mittlere Bereich bei dir ist doch ein 3-Spalten-Layout. |
Das stimmt nur bedingt. Ich habe ja nur den weißen Part in der Mitte. Das andere aussenherum ist der <body>-Tag. Weiß nicht, ob es da jetzt einen Unterschied zwischen gibt, aber ich sehe das jetzt so... Man verzeihe mir mein Unwissen. 
Eigentlich liegt das Problem ja darin, dass der Mittlere Bereich nicht bestimmt, dass erst unter ihm den Space-Bereich für unten beginnen soll.
Zur Einfachheit einfach mal den Quelltext der index-Datei:
| Code: | <?php
include"inc/config.php";
include"inc/functions.php";
echo"<html>\n";
echo" <head>\n";
echo" <title>index</title>\n";
echo" <link rel=\"stylesheet\" type=\"text/css\" href=\"css/page.css\">\n";
echo" <link rel=\"shortcut icon\" href=\"pics/design/favicon.png\">\n";
echo" </head>\n";
echo"<body>\n";
//Definieren eines Java-Scripts, welches es ermöglicht, ein neues Fenster zu öffnen
echo"<script type=\"text/javascript\">\n";
echo"function FensterOeffnen (Adresse) {\n";
echo" Fenster1 = window.open(Adresse, \"Termin-Detail\", \"innerwidth=600,innerheight=400,left=200,top=180, toolbar=no, resizeable=no, status=no\");\n";
echo" Fenster1.focus();\n";
echo"}\n";
echo"</script>\n";
echo" <div id=\"space_oben\">\n"; //DIV-Bereich für den oberen Rand
echo" </div>\n";
echo" <div id=\"mitte\">\n"; //DIV-Bereich für den Mittleren Teil
echo" <div id=\"banner\">\n"; //DIV-Bereich für den Banner
echo" </div>\n";
echo" <div id=\"navi\">\n"; //DIV-Bereich für die Navigation
include"navi.php";
echo" </div>\n";
echo" <div id=\"content\">\n"; //DIV-Bereich für den Inhalt
include"content.php";
echo" </div>\n";
echo" <div style=\"celar: both;\"></div>\n";
echo" </div>\n";
echo" <div id=\"space_unten\">\n"; //DIV-Bereich für den oberen Rand
echo" </div>\n";
echo"</body>\n";
echo"</html>\n";
?> |
und hier noch die CSS-Definitionen:
| Code: | #space_oben {
background-image: url(../pics/design/space_oben.png);
height: 45px;
display: block;
margin-left: 0px;
padding-left: 0px;
border-left-width: 0px;
margin-right: 0px;
padding-right: 0px;
border-right-width: 0px;
margin-top: 0px;
padding-top: 0px;
border-top-width: 0px;
margin-bottom: auto;
padding-bottom: 0px;
border-bottom-width: 0px;
}
#space_unten {
background-image: url(../pics/design/space_unten.png);
height: 45px;
display: block;
margin-left: 0px;
padding-left: 0px;
border-left-width: 0px;
margin-right: 0px;
padding-right: 0px;
border-right-width: 0px;
margin-top: auto;
padding-top: 0px;
border-top-width: 0px;
margin-bottom: 0px;
padding-bottom: 0px;
border-bottom-width: 0px;
}
#mitte {
width: 1000px;
margin: 0 auto;
background: url(../pics/design/space_seite.png);
background-repeat: repeat-y;
}
#banner {
font-family: Helvetica, Arial;
background-image: url(../pics/design/banner.png);
width: 1000px;
height: 120px;
float:left;
}
#navi {
font-family: Helvetica, Arial;
width: 1000px;
min-height: 40px;
background-image: url(../pics/design/button_space.png);
margin: 0px;
float: middle;
text-align: center;
display: block;
}
#content {
font-family: Helvetica, Arial;
background-color: #FFFFFF;
width: 979px;
float:left;
padding: 10px;
display: block;
} |
Vielen Dank schonmal für die Bemühungen.
_________________
Gruß Chris
|
|
| Nach oben |
|
|
$nick = Chris;
Neuer [User]
Anmeldung: 02.09.08
Beiträge: 8
|
| Verfasst am: 07.09.2008, 15:00 Titel: |
|
|
Hat keiner eine Idee zu dem Thema?
Oder ist das Layout von Anfang an schon falsch aufgebaut?
_________________
Gruß Chris
|
|
| Nach oben |
|
|
benjam4
Bekannter [Mod]
Anmeldung: 17.05.06
Beiträge: 1365
Wohnort: Ostfildern ...
|
| Verfasst am: 07.09.2008, 15:40 Titel: |
|
|
Ich verstehe deinen Fehler noch nicht so wirklich. kannst du mal ein (ganzes) bild machen, wie es ist, und wie es sein sollte?
_________________
Rechtschreibfehler sind beabsichtigt, sie dienen der Verschleiherung meiner tatsächlichen Genialität
|
|
| Nach oben |
|
|
$nick = Chris;
Neuer [User]
Anmeldung: 02.09.08
Beiträge: 8
|
| Verfasst am: 17.09.2008, 17:43 Titel: |
|
|
Hi zusammen!
@benjamin4: Ich habe mal die ganze Seite, wie es chris1988 in http://www.webmasterwelt.net/partikel,48444.html schon gewünscht hat, hochgeladen.
Denke so ist es etwas einfacher, weil ihr dann auch Zugriff auf den Quellcode habt. Die entsprechenden CSS-Stellen habe ich euch ja schon gepostet.
Hier also der Link: http://anspitzer.an.ohost.de/php/test/
Hoffe, dass ihr mir nun weiterhelfen könnt.
_________________
Gruß Chris
|
|
| Nach oben |
|
|
|
|
  |
|
Alle Zeiten sind GMT + 1 Stunde
|
| Seite 1 von 1 |
|  |
http://anspitzer.an.ohost.de/data/div-Fehler.png
