Border mit Radius und darin zwei Farben

[Border]

Wow coole Seite! Das hier ist ein Beispiel für dabblet.
.thediv { border:1px solid black; border-radius:20px; }
.firstp { background:yellow; margin:0; padding:10px; }

<div class="thediv">
<p class="firstp">Der erste Abschnitt</p>
<p class="nextp">Der zweite Abschnitt</p>
</div>

Wenn ich .firstp um border-radius:20px 20px 0px 0px; ergänze sieht es wieder aus wie es soll.
Wenn das p im div ist und das div einen gebogenen Rand hat müsste dann nicht das p nur innerhalb dieses Rands liegen? Da hab ich noch ein Problem mitm Verständnis.
Ist nicht schlimm wenn ich den border-radius beim p auch dazu schreibe. Ich wüsste nur gerne warum :-)