Autor |
Nachricht |
Surras
Threadersteller
Dabei seit: 26.08.2011
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Fr 26.08.2011 15:16
Titel CSS float versetzt <div> nach innen (firefox) |
|
|
Hi Leute, nachdem ich ja sonst schon oft hier im Forum gelesen habe hab ich mich jetzt auch mal angemeldet, nachdem ich schon eine Weile Google und Co. umgekrempelt habe und leider nichts passendes gefunden hab.
So, folgendes Problem: wenn ich mir mittels <div>-Container ein Layout zusammenklicke,
Code: | <html>
<title>home</title>
<head>
<link href="style.css" type="text/css" rel="stylesheet">
</head>
<body>
<div id="layout">
<div id="header">Kopf</div>
<div id="menu">Linkleiste</div>
<div id="content">Inhalt</div>
<div id="news">News</div>
<div id="footer">Fusszeile</div>
</div>
</body>
</html> |
und dieses dann mittels der CSS-Datei die Maße etc. festlege, kommt folgendes Phänomen, das sich bei Firefox (bei IE nicht) trotz 'width: 70%' und 'width: 30%' Angabe zweier <div>-Container, die Container nicht nebeneinander positionieren lassen.
Hier gibts erstmal den CSS-Code:
Code: | #layout{
width: 90%;
margin-left: auto;
margin-right: auto;
}
#header{
font-size: 20px;
border: 2px solid black;
text-align: center;
-moz-text-align: center;
}
#menu{
font-size: 20px;
border: 2px solid black;
text-align: center;
-moz-text-align: center;
}
#content{
float: left;
font-size: 20px;
border: 2px solid black;
width: 70%;
text-align: center;
-moz-text-align: center;
}
#news{
float: right;
width: 30%;
border: 2px solid black;
}
#footer{
clear: both;
font-size: 20px;
border: 2px solid black;
text-align: center;
-moz-text-align: center;
} |
uund hier das, was ich versucht habe in worten wieder zu geben:
Hab echt keine Lösung dafür :/
|
|
|
|
|
emorikaner
Dabei seit: 23.06.2009
Ort: -
Alter: -
Geschlecht:
|
Verfasst Fr 26.08.2011 15:55
Titel
|
|
|
Zunächst mal, die fehlt ein Doctype vor deinem Quelltext, deswegen wird dein HTML im IE anders gerendert als im FF.
Der IE zählt dann den border mit zum width, was er eigentlich nicht tun sollte.
Der FF macht das richtig, du hast ja insgesamt 100% Breite + 4px border, was ja über die Gesamtbreite hinausgeht, weshalb er dort dann umbricht.
|
|
|
|
|
Anzeige
|
|
|
fyll
Dabei seit: 20.09.2003
Ort: Augsburg
Alter: 39
Geschlecht:
|
Verfasst Fr 26.08.2011 15:56
Titel
|
|
|
Und dann sollte dir das weiterhelfen.
|
|
|
|
|
Surras
Threadersteller
Dabei seit: 26.08.2011
Ort: -
Alter: -
Geschlecht: -
|
Verfasst Fr 26.08.2011 18:45
Titel
|
|
|
aww... ok das hab ich natürlich nicht gewusst auch das mit dem Doctype nicht^^ naja, bin halt noch Anfänger mit CSS und HTML wurde noch von ganz früher aus Realschulzeiten aus dem Gedächtnis gegraben. Gibt es denn eine Möglichkeit den Rahmen innen anzeigen zu lassen? (so das er entsprechend nicht umbricht und ich dennoch einen Rahmen hab ^^)
Ich möchte nicht mit absouluten werten arbeiten, da das Layout ja flexibel der Auflösung entsprechend sein soll.
|
|
|
|
|
|
|
|
Ähnliche Themen |
Firefox zeigt <div> versetzt an
Hilfe: div float / width:100% - CSS float Box Model
css bild ist versetzt in IE
header versetzt im IE Hilfe!
[solved]Pop up wird versetzt dargestellt
javascript: warum ist der mauszeiger versetzt?
|
|