DIVs nebeneinander

Alles zu Styles, Templates, Icons und Smilies für phpBB 3.0.x, sowie allgemeine Designfragen zur Integration von phpBB in bestehende Websites.
phpBB Styles Demo
Forumsregeln
Bei Style spezifischen Fragen ist der Stylename und die Downloadquelle des Styles erforderlich, besser noch die URL vom betroffenen Forum.
Benutzeravatar
smart
Mitglied
Beiträge: 767
Registriert: 25.01.2005 02:05
Kontaktdaten:

DIVs nebeneinander

Beitrag von smart »

Liebe phpBBler,
ich habe ein Problem mit zwei nebeneinander stehenden DIVs. Im overall_header habe ich folgenden Include angelegt:

Code: Alles auswählen

...{L_LOGIN_LOGOUT}</a></li>
				<!-- ENDIF -->
			</ul>

			<span class="corners-bottom"><span></span></span></div>
		</div>

	</div>

	<!-- CLOUD START -->
	<div id="page-cloud"><!-- INCLUDE overall_cloud.html --></div>
	<!-- CLOUD END -->

	<a name="start_here"></a>
	<!-- HAUPTTEIL LINKS -->

	<div id="page-body">
		
		 <!-- IF S_BOARD_DISABLED and...
Die Datei overall_cloud hat folgendem Inhalt:

Code: Alles auswählen

		<div id="message" class="rules">
			<div class="inner"><span class="corners-top"><span></span></span>
			Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet. Lorem ipsum dolor sit amet, consetetur sadipscing elitr, sed diam nonumy eirmod tempor invidunt ut labore et dolore magna aliquyam erat, sed diam voluptua. At vero eos et accusam et justo duo dolores et ea rebum. Stet clita kasd gubergren, no sea takimata sanctus est Lorem ipsum dolor sit amet.
			<span class="corners-bottom"><span></span></span></div>
		</div>
In der CSS-Datei habe ich nun folgendes festgelegt:

Code: Alles auswählen

#page-body {
	margin: 4px 0;
	margin-right: 210px;
	/*float:right;*/
	/*clear: both;*/
}

#page-cloud {
	float: right;
	width:200px;
	margin: 4px 0;
}
In den FAQ und auf der ucp.php liegen die Container nun wie gewünscht nebeneinander, auf der index.php und der viewforum.php jedoch werden die Container weiterhin übereinander angezeigt:

[ externes Bild ]

Hat jemand einen Tipp, wo der Fehler stecken kann?
JFooty
Ehemaliges Teammitglied
Beiträge: 1868
Registriert: 02.10.2007 11:46

Beitrag von JFooty »

Ich vermute mal, dass hier das Problem liegt: margin-right: 210px; .
Wenn du 210px Außenabstand nach rechts angibst, dürfte kaum Platz für den anderen div-Container bleiben.
Benutzeravatar
smart
Mitglied
Beiträge: 767
Registriert: 25.01.2005 02:05
Kontaktdaten:

Beitrag von smart »

Aber das ist doch genau der Platz für den anderen Container!?!
Benutzeravatar
smart
Mitglied
Beiträge: 767
Registriert: 25.01.2005 02:05
Kontaktdaten:

Beitrag von smart »

Aber das ist doch genau der Platz für den anderen Container!?! Ich habe eher die Vermutung, dass da irgendwo ein DIV zu früh geschlossen wird - schließlich funktioniert es ja in den FAQs. Aber ich wüsste nicht, wo ich suchen soll...
JFooty
Ehemaliges Teammitglied
Beiträge: 1868
Registriert: 02.10.2007 11:46

Beitrag von JFooty »

smart hat geschrieben:Aber das ist doch genau der Platz für den anderen Container!?!
Eben nicht. Sondern damit erzeugst du nur einen Abstand von 210 px zu dem anderen div-Container.
Und dafür reicht der Platz dann wohl nicht. 200px(Containerbreite)+210px(Abstand)=410px!!! :wink:
Benutzeravatar
smart
Mitglied
Beiträge: 767
Registriert: 25.01.2005 02:05
Kontaktdaten:

Beitrag von smart »

Nee, jetzt bin ich wieder einen Schritt zurück:

[ externes Bild ]

Wie gesagt habe ich die Vermutung, dass ein geschlossener Container der Auslöser ist, auch, weil der Footer mit aus dem Rahmen läuft und über die ganze Breite geht. Habe schon mit Firebug gesucht, aber da ist kein <div> zuviel. :-(
Zuletzt geändert von smart am 22.03.2008 16:01, insgesamt 1-mal geändert.
JFooty
Ehemaliges Teammitglied
Beiträge: 1868
Registriert: 02.10.2007 11:46

Beitrag von JFooty »

Gib mir mal den Link zum Forum, damit ich mir die Sache mal aus der Nähe betrachten kann.
Benutzeravatar
smart
Mitglied
Beiträge: 767
Registriert: 25.01.2005 02:05
Kontaktdaten:

Beitrag von smart »

Mittlerweile sind wird durch folgende Änderung schon einen Schritt weiter:

Code: Alles auswählen

.forabg
{background:#B1B1B1 none repeat-x scroll 0pt;
 /*clear:both; entfernt */
 margin-bottom:4px;
 padding:0pt 5px;}
Leider wird jetzt der Container forabg nicht mehr korrekt in Höhe und Breite angezeigt. Hat noch jemand einen Tipp?

[ externes Bild ]

Direkt zum Forum geht es hier: http://tinyurl.com/2w3sxe
JFooty
Ehemaliges Teammitglied
Beiträge: 1868
Registriert: 02.10.2007 11:46

Beitrag von JFooty »

Da bin ich wieder. Füge bei .forabg noch float:left hinzu!
Benutzeravatar
smart
Mitglied
Beiträge: 767
Registriert: 25.01.2005 02:05
Kontaktdaten:

Beitrag von smart »

Fast haben wir's geschafft. Auf der Index geht es jetzt.

Aber hier, hier und hier springt er noch nicht nach links oder läuft sogar in das rechte Feld hinein.
Antworten

Zurück zu „[3.0.x] Styles, Templates und Grafiken“