У меня есть сгенерированное меню страницы, которое по структуре будет похоже на следующий вложенный список:

<code><ul>
    <li>Page 1</li>
    <li>Page 2</li>
    <li>
        Page 3
        <ul>
            <li>Subpage 1</li>
            <li>Subpage 2</li> <!-- Can I target ONLY this element? -->
        </ul>
    </li>
</ul>
</code>

Обратите внимание, что этот список является динамическим.The number of items and number of levels are not predictable, Таким образом, что-то подобное не будет достаточно гибким:

<code>/* I know this does not have great browser support - just an example */
ul > li > ul > li:last-child {
    /* CSS here */
}
</code>

Я понимаю, что могу изменить свой серверный код, чтобы добавить класс к последнему элементу, но сначала я хотел бы узнать, возможно ли это в CSS.

Чтобы усложнить задачу, я хотел бы настроить таргетинг на все основные браузеры вместе с IE 7+.

Is it possible to target the very last list item using CSS?

В основном мне это нужноскрипка решено (через @ Pumbaa80).