<p> an <div> binden

[Thomas2705]

Ich habe ein <div> = "header".
In diesem Element befindet sich ein <p>
Die EIgenschaften werden durch css definiert.


.header{
background-color:red;
height:100px;
min-height:100px;
white:100%;
}

.header p {
color:white;
font-family: "Trebuchet MS",Arial,Helvetica,sans-serif;
font-size: 20px;
padding-left:10%;
}

Wenn ich im header p padding-top: 30% eingebe veräßt das p Element das div.
Wie geht es das das eingebettete Element nicht das übergeordnete Element in diesem Fall das <div> verlassen kann?

 

[Banana_Jones]

overflow: hidden.

Im Übrigen ist die Bezugsgröße für die "30%" bei padding-top nicht, wie man annehmen könnte, die Höhe deines Elements, sondern dessen Breite. Das nu als Hinweis, falls die nächste Frage "Bei größeren Bildschirmen ist der Abstand größer, warum" sein sollte...