[CSS] list blijft maar inheriten

[Reveller]

Ik heb - vereenvoudigd - de volgende pagina:

HTML:

<div id="main">
  <div id="text">
    <ul id="admin-index">
      <li>stuff
    </ul>
  </div>
</div>

Hierbij onder andere de volgende css:

Cascading Stylesheet:

#text ul {
  list-style-image: url(bullet.gif);
}

ul#admin-index {
  list-style-type: none;
}

Ik wil dat elke list in div#text bullets krijgt, behalve een list met id "admin-index". Met de css hierboven, krijg ik gewoon bullets in die list, ook als ik achter list-style-type: none !important; zet. Hoe kan ik dit wel oplossen?

[Bozozo]

Weet je zeker dat de specificity van de style waarmee je 'none' toewijst hoger is dan van de andere style in je niet-versimpelde CSS?

[Zeebonk]

probeer eens:

ul.admin-index ipv ul#admin-index

en dan

<ul class="admin-index">

weet niet zeker of dat helpt, is wel netter volgens mij

[TheDane]

Met de code in TS werkt 't bij mij (@ Firefox 3) gewoon.
Weet je zeker dat je niet ergens nog een andere style gedefinieerd hebt?

[Little Penguin]

Het is niet direct een antwoord op je vraag, maar misschien wel een oplossing voor je probleem:

Cascading Stylesheet:

#text ul {
  list-style-image: url(bullet.gif);
}

#text ul#admin-index, ul#admin-index  {
  list-style-type: none;
}

Hoe je er verder rekening mee dat je het ID admin-index verder maar 1x per pagina mag gebruiken? Zodra je 2x id="admin-index" in je markup hebt staan zou de User Agent (browser) wel eens kunnen besluiten om ze allemaal maar te negeren..

[Sebazzz]

Klinkt als een misplaatste '<instructie> !important;'.

[Goodfellas]

Sowieso raar om dit te gebruiken:

ul#admin-index {
list-style-type: none;
}

Waarom niet, zoals erboven:

#admin-index ul {
list-style-type: none;
}

Misschien dat het niet veel uitmaakt, maar het maakt het in iedergeval duidelijker. Door consistent te zijn in je css maak je het een hoop leesbaarder. Tevens vraag ik mij ook af of je niet gewoon classess en id's door elkaar haalt: id's gebruik je maar één keer.

[Bozozo]

Goodfellas schreef op dinsdag 30 september 2008 @ 10:41:
Sowieso raar om dit te gebruiken:

ul#admin-index {
list-style-type: none;
}

Waarom niet, zoals erboven:

#admin-index ul {
list-style-type: none;
}

Misschien dat het niet veel uitmaakt, maar het maakt het in iedergeval duidelijker. Door consistent te zijn in je css maak je het een hoop leesbaarder. Tevens vraag ik mij ook af of je niet gewoon classess en id's door elkaar haalt: id's gebruik je maar één keer.

Denk even na... jouw 'consistente schrijfwijze' is een totaal andere instructie.

Er is niets mis met de CSS van de TS, aangezien hij zelf al aangeeft dat er één list is met id 'admin-index'.

[Goodfellas]

Bozozo schreef op dinsdag 30 september 2008 @ 10:48:
[...]

Denk even na... jouw 'consistente schrijfwijze' is een totaal andere instructie.

Er is niets mis met de CSS van de TS, aangezien hij zelf al aangeeft dat er één list is met id 'admin-index'.

Edit: d0h ik zie het nu, slecht gelezen

Verder vond ik dit op w3schools: http://www.w3schools.com/Css/css_list.asp

Ik denk dus dat je list-style moet gebruiken ipv list-style-type. Waarschijnlijk zet je met het laatste het type wel op none, maar het image niet. (correct me if i'm wrong)

[ Voor 4% gewijzigd door Goodfellas op 30-09-2008 11:05 ]

[PinQ]

Met list-style-type overwrite je inderdaad niet list-style-image. Dus als je list-style:none; doet zou 'ie het niet meer moeten doen.