[Erledigt] CSS DIV-Container Problem, ich werd bekloppt, hilfe!

19.11.2005, 23:13

Hallo

ich versuche heute zum ersten mal, mittels DIV-Containern ein Layout zu erstellen. Ich habe wie ï¿½blich einen Header, einen Body und einen Footer. Jeweils ein DIV-Container.

Die drei sind in einem weiteren DIV-Container.

Nun zum Header, an dem beisse ich mir nï¿½mlich die Zï¿½hne aus:

Der Header ist wiederum in 2 DIV-Container aufgeteilt. Links befindet sich das Logo als Hintergrundbild, und rechts ist Platz (z.b. fï¿½r nen Banner).

Da wo der Platz fï¿½r den Banner ist, habe ich 3 DIV Container rein geschmissen, die ï¿½bereinander liegen. Im mittleren DIV-Container versuche ich mit weiteren einzelnen kleinen DIV-Containern stï¿½ck fï¿½r Stï¿½ck eine "Karteikarten-Lasche" zusammen zu basteln. Grafiken sind schon erstellt. Und mit Tabellen wï¿½re das ï¿½berhaupt gar kein Problem.

Und da klemmts: Das erste Segment der Karteikarten-Lasche funktioniert. Dann kommt das Mittelstï¿½ck. Und das funktioniert ï¿½berhaupt nicht! Ob wohl Breite und Lï¿½nge alles passt und genau berechnet, wird es eine Zeile weiter drunter platziert! AUSSERHALB des DIV-Containers. Zur Kontrolle habe ich einen Rahmen eingeblendet. Das verfluchte Hintergrundbild befindet sich einfach ausserhalb. Wie zum kukuk geht das??? Dann habe ich alles mï¿½gliche eingegeben um diese bescheuerten Linebreaks zu vermeiden. Auch schon die gesamte Struktur im Quellcode auf eine einzige Zeile gebracht. Ohne wirkung!

Ich werde noch bekloppt!!!

-----------------------------------------------------------------

hier der DIV-Container wo der Header mit Logo und (nicht funzendem) Karteikarten-DIVs enthalten ist:

Code:

    <div id="header">
      <div id="header_logo"></div>
	  <div style="width:100%; height:66px; border:0px; border-color:#000000; border-style:solid; padding:0px;">banner</div>
	  <div style="width:100%; height:28px; border:1px; border-color:#f0f00f; border-style:solid; padding:0px; text-align:rechts; white-space:nowrap;">
	  	
	  	<div style="width:10px; height:28px; padding:0px; background:url(../grafik/topnav_line_links.jpg) no-repeat; white-space:nowrap;"></div>
	  	<div style="width:*; height:28px; padding:0px; background:url(../grafik/topnav_line_oben.jpg) no-repeat; white-space:nowrap;">Link</div>
	  	<div style="width:10px; height:28px; padding:0px; background:url(../grafik/topnav_line_rechts.jpg) no-repeat; white-space:nowrap;"></div>
	  </div>
	  <div style="width:100%; height:21px; border:0px; border-color:#000000; border-style:solid; padding:0px; text-align:left;">z</div>
    </div>

xabbuh · 20.11.2005, 12:51

Um Elemente nebeneinander zu positionieren, musst du die CSS-Eigenschaft float verwenden.

20.11.2005, 17:54

danke, habe ich gemacht... im IE funktioniert es einwandfrei. Beim Firefox aber nicht. Die Elemente sind quasi ineinander gerückt... wenigstens die Linebreaks sind weg.

Wie sage ich in einem DIV-Container, welches Element eine spalte und welches eine Zeile sein soll? Bei Tabellen ist das alles eindeutig definiert mit TR und TD...

xabbuh · 20.11.2005, 20:20

Wenn du den Textfluss um ein Element wieder beenden möchtest, kannst du dafür die CSS-Eigenschaft clear verwenden.

30.11.2005, 00:49

such mal bei google nach einem css-editor .. das hilft sehr oft wenn man nicht alle befehle im köpple hat ..

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
Suchfunktion mit Blätterfunktion auf Ergebnisseite?! Hilfe!	nicobischof	PHP Tipps 2008	1	31.01.2008 13:42
Div Container Problem im IE	mokus	HTML, Usability und Barrierefreiheit	4	17.04.2007 14:58
Problem mit Container	max-dhom	HTML, Usability und Barrierefreiheit	3	20.09.2006 11:10
datensätze defekt oder problem mit dem einlesen?	Ministry	Datenbanken	4	06.07.2006 18:42
Strind <> Array Problem		PHP-Fortgeschrittene	5	23.10.2005 16:52
[Erledigt] Problem mit cp und &amp;quot;Argument list too long&amp;quot;		Server, Hosting und Workstations	9	11.10.2005 22:17
Bildergallery - Problem - HILFE!		PHP Tipps 2005-2	2	21.08.2005 20:54
[Erledigt] Container im Firefox falsch dargestellt		HTML, Usability und Barrierefreiheit	27	15.08.2005 23:18
[Erledigt] VARIABLEN WERDEN NICHT RICHTIG VERARBEITET!!!! HILFE		PHP Tipps 2005-2	6	02.07.2005 18:32
Problem mit osCommerce brauche dringend Hilfe...		PHP Tipps 2005	12	13.05.2005 08:40
[Erledigt] Hilfe...PhpBB Session Problem!!		PHP Tipps 2004-2	2	15.12.2004 18:28
[Erledigt] Verzeichniss Problem!!!! HILFE!!!!!		Server, Hosting und Workstations	6	30.11.2004 21:42
riesen problem mit zeichensatz. bitte hilfe		PHP Tipps 2004-2	6	29.11.2004 21:53
[Erledigt] Hilfe - Problem mit Warenkorb		PHP Tipps 2004	1	26.11.2004 11:32
foreach problem	mAy^daY	PHP Tipps 2004	3	02.06.2004 20:29

19.11.2005, 23:13
Gast Beiträge: n/a	[Erledigt] CSS DIV-Container Problem, ich werd bekloppt, hilfe! Hallo ich versuche heute zum ersten mal, mittels DIV-Containern ein Layout zu erstellen. Ich habe wie ï¿½blich einen Header, einen Body und einen Footer. Jeweils ein DIV-Container. Die drei sind in einem weiteren DIV-Container. Nun zum Header, an dem beisse ich mir nï¿½mlich die Zï¿½hne aus: Der Header ist wiederum in 2 DIV-Container aufgeteilt. Links befindet sich das Logo als Hintergrundbild, und rechts ist Platz (z.b. fï¿½r nen Banner). Da wo der Platz fï¿½r den Banner ist, habe ich 3 DIV Container rein geschmissen, die ï¿½bereinander liegen. Im mittleren DIV-Container versuche ich mit weiteren einzelnen kleinen DIV-Containern stï¿½ck fï¿½r Stï¿½ck eine "Karteikarten-Lasche" zusammen zu basteln. Grafiken sind schon erstellt. Und mit Tabellen wï¿½re das ï¿½berhaupt gar kein Problem. Und da klemmts: Das erste Segment der Karteikarten-Lasche funktioniert. Dann kommt das Mittelstï¿½ck. Und das funktioniert ï¿½berhaupt nicht! Ob wohl Breite und Lï¿½nge alles passt und genau berechnet, wird es eine Zeile weiter drunter platziert! AUSSERHALB des DIV-Containers. Zur Kontrolle habe ich einen Rahmen eingeblendet. Das verfluchte Hintergrundbild befindet sich einfach ausserhalb. Wie zum kukuk geht das??? Dann habe ich alles mï¿½gliche eingegeben um diese bescheuerten Linebreaks zu vermeiden. Auch schon die gesamte Struktur im Quellcode auf eine einzige Zeile gebracht. Ohne wirkung! Ich werde noch bekloppt!!! ----------------------------------------------------------------- hier der DIV-Container wo der Header mit Logo und (nicht funzendem) Karteikarten-DIVs enthalten ist: Code: <div id="header"> <div id="header_logo"></div> <div style="width:100%; height:66px; border:0px; border-color:#000000; border-style:solid; padding:0px;">banner</div> <div style="width:100%; height:28px; border:1px; border-color:#f0f00f; border-style:solid; padding:0px; text-align:rechts; white-space:nowrap;"> <div style="width:10px; height:28px; padding:0px; background:url(../grafik/topnav_line_links.jpg) no-repeat; white-space:nowrap;"></div> <div style="width:*; height:28px; padding:0px; background:url(../grafik/topnav_line_oben.jpg) no-repeat; white-space:nowrap;">Link</div> <div style="width:10px; height:28px; padding:0px; background:url(../grafik/topnav_line_rechts.jpg) no-repeat; white-space:nowrap;"></div> </div> <div style="width:100%; height:21px; border:0px; border-color:#000000; border-style:solid; padding:0px; text-align:left;">z</div> </div>


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

20.11.2005, 12:51
xabbuh Erfahrener Benutzer Registriert seit: 13.11.2005 Beiträge: 2.583	Um Elemente nebeneinander zu positionieren, musst du die CSS-Eigenschaft float verwenden.

20.11.2005, 17:54
Gast Beiträge: n/a	danke, habe ich gemacht... im IE funktioniert es einwandfrei. Beim Firefox aber nicht. Die Elemente sind quasi ineinander gerückt... wenigstens die Linebreaks sind weg. Wie sage ich in einem DIV-Container, welches Element eine spalte und welches eine Zeile sein soll? Bei Tabellen ist das alles eindeutig definiert mit TR und TD...

20.11.2005, 20:20
xabbuh Erfahrener Benutzer Registriert seit: 13.11.2005 Beiträge: 2.583	Wenn du den Textfluss um ein Element wieder beenden möchtest, kannst du dafür die CSS-Eigenschaft clear verwenden.

30.11.2005, 00:49
Gast Beiträge: n/a	such mal bei google nach einem css-editor .. das hilft sehr oft wenn man nicht alle befehle im köpple hat ..