News - Features - Downloads - Forum - Team - Support - Switch View: Screen
Login - Registrierung - Passwort vergessen

Antworten: 3
Seite [1]
Munky


Rock the board




Beiträge: 50
# Thema - 30.12.2006 um 19:26 Uhr
Ich hab schon seit längerem ein Problem, wenn ich bei Divs mit float arbeite, aber ich komme zu keiner Lösung. Ich hab schon im Footer clar:both gesetzt, es kommt der Sache schon näher aber trotzdem ist es nicht perfekt..


Hinzu kommt, dass der Internet Explorer es richtig darstellt, jedenfalls so wie ich es haben möchte, der Firefox jedoch falsch, hier mal die Bilder dazu..


Firefox (falsch):



Internet Explorer (richtig):



Und Demo: [Link]


Quelltext der HTML +-

<div align="center">
<div id="top">Header</div>
<div id="global">
<div id="left">Hier mal ein kurzer Text</div>
<div id="center">Ein etwas l&auml;ngerer, aber noch kurzer Text</div>
<div id="right">Ein wesentlich l&auml;ngerer Text, mit mehr Informationen und sch&ouml;nen Beispielen.</div>
</div>
<div id="footer">Footer</div>
</div>



Quelltext der CSS +-

body,td,th {
color: #333333;
font-family: Arial, Helvetica, sans-serif;
}
body {
background-color: #333333;
margin-left: 20px;
margin-top: 20px;
margin-right: 20px;
margin-bottom: 20px;
}
#global {
width:300px;
background-color:#FFFFFF;
padding:20px;
}
#top {
background-color:#FFFFFF;
margin-bottom:10px;
width:340px;
}
#left, #center, #right {
width:100px;
float:left;
}
#left {
background-color:#990000;
}
#center {
background-color:#CC6600
}
#right {
background-color:#FFCC00;
}
#footer {
background-color:#FFFFFF;
margin-top:10px;
width:340px;
clear:both;
}



Ich hoffe ihr könnt mir weiter helfen
Gruß..


Zuletzt editiert von Munky am 30.12.2006 um 19:27 Uhr (2x Editiert)
Inaktiv
Munky
Thread-Ersteller


Rock the board




Beiträge: 50
# Antwort: 1 - 30.12.2006 um 19:48 Uhr
ok, ich habe display:table bei #global hinzugefügt, nun klappt es ...

kann geclosed werden ^^


Inaktiv
|
Vyper


Rock the board




Beiträge: 71
# Antwort: 2 - 30.12.2006 um 19:53 Uhr
Das Verhalten kann ich nicht nur im Firefox feststellen, sondern auch bei Opera. Der IE stellt das ganze zwar richtig dar, hat es jedoch eigentlich falsch interpretiert.
Eine mögliche Lösung wäre, dem Content-Container auch ein float zuzuweisen, am besten "float: left".
Musste mal gucken ob das klappt, sollte aber.
Wenn sich die Größe vom Contentbereich dadurch verändert, dann halt noch ne width definieren...
Ansonsten, wenn das nicht klappen sollte, kannst du einfach noch unter die gefloateten Container z.B. einen Absatz schreiben (<p>&nbsp;</p>), was ich aber persönlich nicht gerade elegant finde...


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


Inaktiv
|
h4ze


Geekboy




Herkunft: Itzehoe
Beiträge: 1433
# Antwort: 3 - 30.12.2006 um 21:44 Uhr
nach deml gelben div folgendes setzen:

 
1.
1. / 2. / ... 
 <div style="clear: both;"></div>


müsste auch funzen!

/close.


------------------
gembee.com - Upload your Life!
A Social Filesharing Network
"Wie YouTube, nur für alle Datei-Typen"


Zuletzt editiert von h4ze am 30.12.2006 um 21:44 Uhr (1x Editiert)
Inaktiv
|
Antworten: 3
Seite [1]


Sie müssen sich registrieren, um zu antworten.


ClanSphere Project - Mailus - Imprint - Disclaimer - Scriptinfo