verschiedene Abstände in unterschiedlichen Browsern

[Sönke Tesch]

Ich habe wieder mal ein Problem mit CSS. In unterschiedlichen Browsern führen die gleichen Angaben zu verschiedenen Abständen.

jetz habe ich aber das Problem, dass die Seite im IE und NN gleich aussehen, Mozilla aber Faxen macht, sprich hier sind die Abstände eigentlich zu groß. Ich haber Überschriften und Absätze in divs gepacht, etwa so:

<div id="ueberschrift">
  <h2>
    Überschrift
  </h2>
</div>

<div id="spaltelinks">
  <p>
    Blindtext - Blindtext - Blindtext - Blindtext -
    Blindtext - Blindtext - Blindtext - Blindtext -
  </p>
</div>

div {
  margin:0px;
  padding:0px;
}

Zumindest Deine Überschriftkonstruktion scheint in dieser Form doch irgendwie herzlich sinnlos. Warum packst Du <h2> in ein extra <div>? Formatier doch gleich die Überschrift selber.
Selbiges (abzüglich sinnlos) gilt für <p>.

Du kannst CSS auf alle Elemente anwenden, nicht nur auf <div>s. Und wenn Du nur im <div> die Abstände änderst, mußt Du dich doch auch nicht wundern, wenn alle anderen Elemente ihre Abstände beibehalten.

Probier's mit:

h2,p
   {
    margin:0;
    padding:0;
   }

Ich bin mir ziemlich sicher, daß Du damit den gewünschten Effekt erreichst.

Davon unabhängig ist es meistens sinnvoll, bei Textabständen die Schrifthöhe als Maßstab zu nehmen. 10 Pixel Absatz sehen bei 10 Pixel hohem Text vielleicht gut aus, falls jemand jedoch den Text im Browser  auf beispielsweise 30 Pixel vergrößert, machen die 10 Pixel vielleicht nur noch den einfachen Zeilenabstand aus und die ganze Geschichte geht in einer Buchstabensuppe unter. Deshalb besser ems oder Prozente.

Gruß,
  soenk.e