Nico R.: Warum stellt sich height:0 eigentlich so an? Bzw. ich?

Beitrag lesen

Hallo zusammen,

wieso kriege ich dieses div nicht per einfachem height: 0 auf eine Höhe von Null?

<!DOCTYPE html>
<html lang="de">
<head>
  <style>
  div {
    display: block;
    box-sizing: border-box;
	max-width: 50vw; 
	height: 0;	
	margin: 10vh auto;
	padding: 0.7em;
	border: 1px solid black;
  line-height: 0;
	overflow: hidden;
  }	
  </style>
</head>
<body>
  <div>DIV</div> 
</body>
<html>

Ich muss explizit auch noch padding und border auf 0 setzen. Warum ist das so? Was ist der Sinn dahinter? Und wenn ich davon ausgehe, dass es am Boxmodell liegt, warum hat dann box-sizing: border-box hier keinen Effekt?

Eigentlich ist das doch Unterrichtsstoff aus der 1. Stunde HTML. Ich frage mich, wie ich es bisher überhaupt geschafft habe, irgendwelche Seiten zu bauen. Ich war da wohl gerade Kreide holen...

Schöne Grüße

Nico