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

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

  1. Hi,

    Dazu selektiere ich über 'ul:last-child' das letzte Element vom Typ 'ul'

    Da liegt der Denkfehler.
    Du selektierst alle ul-Elemente die keine Nachfolgende Nodes mehr haben.

    Was du eigentlich möchtest ist :last-of-type

    ~dave

    1. Uh, Leute, ich danke Euch ... habs begriffen !

  2. Om nah hoo pez nyeetz, Jan!

    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 ?

    nicht zwangsläufig. Um ganz sicher zu gehen, verwende last-of-type

    ...-child vs. ...-of-type

    Für jeden Hinweis dankbar ...

    zusammenfallende Außenabstände

    Matthias

    --
    1/z ist kein Blatt Papier.

  3. Hi,

    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 ?

    Nein - weil es nicht das letzte Kind von Body ist, schließlich kommt noch ein P danach.

    MfG ChrisB

    --
    RGB is totally confusing - I mean, at least #C0FFEE should be brown, right?
  4. nach dem das mit dem :last-child geklärt ist nur ein Hinweis:

    Vielleicht wäre mit ul + p und einem margin-top auch eine entsprechende Formatierung möglich.