Ungewollter Abstand zwischen Elementen
Franz
- css
0 Mathias Brodala0 Franz
Morgensen,
ich frage mich (und die leserschaft), warum einige eigentlich durchaus nicht schlechte Browser (Opera, Firefox) einen Kotzkrämpfe hervorrufenden Abstand zwischen BODY und DIV machen, obwohl das eigentlich überhaupt gar nicht erwünscht ist:
body {
background-color: #F2F2F2;
margin: 0px;
padding: 0px;
}
#page {
font: 12px Helvetica, Arial, Sans-Serif;
width:790px;
margin: auto;
padding: 0px;
background: #ffffff url(background.png);
color:black
}
#nerdytext { margin-right:30px; margin-left:300px}
Ergebnis (FF 1.5.0.6 oder so):
<biolek>Interessant</biolek>: Dieser Abstand tritt nur auf, sofern DIV "page" ein Block-Element beinhaltet - z.B. div "nerdytext". Spricht ja nich so für CSS, dieser dumme Bug. Nicht alles ist Gold, was glänzt... hahaha.
Gruß
Franz
PS: Man könnte bei #page einen margin-top:-15px oder so einfügen, aber das find ich doof.
Hallo Franz.
body {
background-color: #F2F2F2;
margin: 0px;
padding: 0px;
}
#page {
font: 12px Helvetica, Arial, Sans-Serif;
width:790px;
margin: auto;
padding: 0px;
background: #ffffff url(background.png);
color:black
}
#nerdytext { margin-right:30px; margin-left:300px}
Ohne das zugehörige HTML ist das CSS wertlos.
> Ergebnis (FF 1.5.0.6 oder so):
> 
Ich kann dieses Resultat mit folgendem Code nicht nachstellen:
~~~html
<body>
<div id="page">
<div id="nerdytext">Langer Fülltext …</div>
</div>
</body>
PS: Man könnte bei #page einen margin-top:-15px oder so einfügen, aber das find ich doof.
Oder einfach folgendes am Anfang eines jeden Stylesheets notieren und sich keine weiteren Gedanken über eventuelle Abstände in Browserstylesheets machen:
* {
margin:0;
padding:0;
}
Einen schönen Montag noch.
Gruß, Mathias
Ohne das zugehörige HTML ist das CSS wertlos.
Ich kann dieses Resultat mit folgendem Code nicht nachstellen:
<body>
<div id="page">
<div id="nerdytext">Langer Fülltext …</div>
</div>
</body>
Ja, fast richtig. Nur, dass in nerdytext nicht nur einfacher langer Fülltext drin is, sondern auch Block-Elemente a la <h1> und <p>. Ich habe das Gefühl, diese Biester sind dafür verantwortlich.
> Einen schönen Montag noch.
Ebenso.
Gruß
Franz
Hi,
Jsondern auch Block-Elemente a la <h1> und <p>. Ich habe das Gefühl, diese Biester sind dafür verantwortlich.
Da liegst Du richtig. Besonders Überschriften haben im Browser-CSS meist margins. Im Firefox halt ein margin-top - was ja auch sinnvoll ist, da eine Überschrift i.d.R. ein neues Kapitel einleitet. Beschwere Dich also nicht über das Browser-CSS von Firefox.
freundliche Grüße
Ingo