Jan: Margin für ul:last-child setzen

Beitrag lesen

Hallo,

ich habe ein "hartnäckiges" Verständnisproblem mit dem Pseudoklassen-Selektor ':last-child'.

Im nachfolgenden Script befinden sich zwei unsortierte Listen. Auf die beiden Listen folgt ein <p>Absatz</p>, der einen definierten Abstand zur jeweils letzten Liste im Dokument halten soll:

-------------------------------------
-------------------------------------

<html>

<head>

<title></title>

<style type="text/css">
<!--

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

ul:last-child
{
margin-bottom:0px;
}

-->
</style>

</head>

<body>

<div> <!-- Wrappendes DIV notwendig ? Wenn ja: Warum ? -->

<ul>
<li>Listeneintrag 01</li>
<li>Listeneintrag 02</li>
<li>Listeneintrag 03</li>
</ul>

<ul>
<li>Listeneintrag 01</li>
<li>Listeneintrag 02</li>
<li>Listeneintrag 03</li>
</ul>

</div> <!-- Wrappendes DIV notwendig ? Wenn ja: Warum ? -->

<p>Absatz</p>

</body>

</html>

-------------------------------------
-------------------------------------

Dazu selektiere ich über 'ul:last-child' das letzte Element vom Typ 'ul' und weise diesem per 'margin-bottom' einen Aussenabstand nach unten zu.

Leider wird diese Anweisung erst umgesetzt, wenn ich die Listen mit einem "wrappenden" <div> umschließe - verstehen tue ich das allerdings nicht.

Frage: Ohne den <div>-Container selektiere ich mit 'ul:last-child' doch das letzte <ul>-Element innerhalb des übergeordneten "wrappenden" (Eltern-)Elementes <body> - oder etwa nicht ?

Für jeden Hinweis dankbar ...

Mfg Jan