Johannes: height:100% bei <div>

Hallo, ersmal wünsch ich allen schöne Feiertage und ein gutes neues Jahr.

Ich habe folgendes Problem, ich hab eine Seite mit einem <div> Element über das ganze Dokument. Was ich bei dem ganzen jetzt nicht verstehe ist warum im IE alles so dargestellt wird wie ich mir das gedacht habe, aber im Mozilla man scrollen muß um das Ende zu sehen.

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>

<head>

<meta content="text/html; charset=ISO-8859-15" http-equiv="content-type">

<title>Willkommen auf www.Tagaluba.at</title>

<style type="text/css">

body {
  background-color: black;
  color: black;
  font-size: 1.2em;
  font-family: verdana, arial, helvetica, sans-serif;
  text-align: center;
  margin: 0px;
 }

div {
  background-color: yellow;
  height:100%;
  margin-left: 15%;
  margin-right: 15%;
  padding:30px;
 }

</style>

</head>

<body>
  <div>
   .
   .
   .
   .
  </div>
</body>

</html>

auch zu sehen unter www.tagaluba.at

mfg Johannes

  1. Hi,
    also wenn Du das DIV nur hast wegen dem Gelben Hintergrund,
    dann mach doch stattdessen ne Tabelle ohne Rahmen mit gelben Hintergrund. Das sollte im Mozilla auch gehen, denke ich mal. :-)

    Gruss

    Meik

  2. http://www.css4you.de/wsboxmodell/index.html#browser

    1. Aber alles bis auf die Höhe ist doch null, das heißt margin = 0 padding = 0 border = 0 height = 100%, deswegen müßte doch das Gesamte auch eine Höhe von 100% des body tags haben, also 100% des sichtbaren Bereich oder?

      mfg Johannes

      1. Hallo,

        Aber alles bis auf die Höhe ist doch null, das heißt margin = 0 padding = 0 border = 0 height = 100%

        Und was hat body für ein padding (Innenabstand)?
        Und was hat dein div für ein margin-top bzw. margin-bottom (Außenabstand)?
        Diese Werte hast du nicht angegeben, also gelten die Browser-Defaults. Und die addieren sich zur angegebenen Höhe von 100%.

        deswegen müßte doch das Gesamte auch eine Höhe von 100% des body tags haben, also 100% des sichtbaren Bereich oder?

        Plus die zutreffenden margins und paddings. Außerdem ist body nicht unbedingt mit der Höhe des sichtbaren Bereichs identisch. Das fällt vor allem auf, wenn das Browserfenster höher ist als der Inhalt. Denn body ist nur so hoch wie sein Inhalt.

        Ciao,

        Martin

        --
        "Life! Don't talk to me about life!"
          (Marvin, the paranoid android in Douglas Adams' "The Hitchhiker's Guide To The Galaxy"
        1. Hi,

          Und was hat dein div für ein margin-top bzw. margin-bottom (Außenabstand)?
          Diese Werte hast du nicht angegeben, also gelten die Browser-Defaults.

          die für ein Element ohne semantische Bedeutung wie DIV nicht definiert sind bzw. 0 sind.
          Ansonsten hast Du natürlich recht.

          freundliche Grüße
          Ingo

      2. Hi,

        Aber alles bis auf die Höhe ist doch null, das heißt margin = 0 padding = 0

        Nö, padding hast Du mit 30px angegeben.

        cu,
        Andreas

        --
        Warum nennt sich Andreas hier MudGuard?
        Schreinerei Waechter
        Fachfragen per E-Mail halte ich für unverschämt und werde entsprechende E-Mails nicht beantworten. Für Fachfragen ist das Forum da.