Archief - CSS: list-style-image: IE=ok FF=niet ok

j

jorrelemargi

Legacy Member

• 10 dec 2006

• #1

ik gebruik de volgende manier om de standaard bullets van een lijst <ul> te vervangen door een image. Dit werkt perfect in internet explorer maar niet in Firefox 1.5. Enig idee of firefox 1.5 dit zou moeten ondersteunen of niet?

.item-list ul {
list-style-image: url(http://www.server.be/images/list_image.gif);
}

Q

Quilombo

Legacy Member

• 10 dec 2006

• #2

url('...')
quotes vergeten dus

C

Cakeman

Legacy Member

• 11 dec 2006

• #3

Die quotes zijn niet nodig.
Zet die style eens op je <li> in plaats van je <ul>. Volgens mij gaat het dan werken.

j

jorrelemargi

Legacy Member

• 11 dec 2006

• #4

Cakeman zei:

Die quotes zijn niet nodig.
Zet die style eens op je <li> in plaats van je <ul>. Volgens mij gaat het dan werken.

Klik om te vergroten...

quotes zijn inderdaad niet nodig...

in <li> plaatsen lukt ook niet? bizar...

in <ul> werkt het perfect onder internet explorer, normaal ondersteunt firefox 1.5 hetzelfde dacht ik...? Kan iemand eens lokaal testen op firefox?

o

orez

Legacy Member

• 11 dec 2006

• #5

de image instellen als background-image van je li.

Q

Quilombo

Legacy Member

• 11 dec 2006

• #6

jah dan vergis ik me
bij mijn weten werkt het zonder quotes toch niet in alle browsers (ie5, mac ie? dno hoor).

kan me vergissen natuurlijk

B

Bertold

Legacy Member

• 11 dec 2006

• #7

http://css.maxdesign.com.au/listutorial/

lees en leer bij

j

jorrelemargi

Legacy Member

• 13 dec 2006

• #8

bt belgium zei:

http://css.maxdesign.com.au/listutorial/

lees en leer bij

Klik om te vergroten...

that's what I'm talking about ! thanks!

en gij ook Orez, exact wat je zei!

K

KoenDK

Legacy Member

• 13 dec 2006

• #9

oplossing?


ik veronderstel

.item-list li
{
background-image: url(arrow.gif);
background-repeat: no-repeat;
}

j

jorrelemargi

Legacy Member

• 16 dec 2006

• #10

.item-list ul
{
list-style-type: none;
padding: 0;
margin: 0;
}

.item-list li
{
background-image: url(http://www.uzegt.be/themes/uzegt/images/list_image.gif);
background-repeat: no-repeat;
background-position: 0 .4em;
padding-left: .6em;
}



blijkt dat die standaard bullets gewoon blijven staan.... mijn LI image wordt wel getoond, maar padding heeft ook geen effect?

de class staat wél goed... enig idee wat er mis is?

X

Xavez

Legacy Member

• 16 dec 2006

• #11

Dit werkt bij mij thans perfect:

Code:

.item-list ul li {list-style: url(http://www.uzegt.be/themes/uzegt/images/list_image.gif);}

Misschien moet je nog een !important toevoegen, omdat je je algemene list-style op none hebt gezet? .

j

jorrelemargi

Legacy Member

• 16 dec 2006

• #12

hij staat niet op none, want the bullets staan er nog steeds? kan je de ganse code die ik heb ingevoegd bij jouw eens checken?

j

jorrelemargi

Legacy Member

• 16 dec 2006

• #13

thanks Xavez, works like a charm ! topic mag gesloten worden