9 berichten aan het bekijken - 1 tot 9 (van in totaal 9)
  • Q:
    Bijdrager
    iBert

    [CSS] List image wordt niet getoond in Internet Explorer/PC

    Op http://www.puzzlecom.com vind je een website waar ik momenteel aan het werken ben voor mijn stage. Op de 2de hoofdlink “concepten” vind je een opsomming. Ik heb deze opsomming aangepast met CSS, maar hij weigert het aangepaste opsommingsteken te tonen in Internet Explorer 6 op PC. In elke andere browser werkt het zonder problemen. Heeft er hier iemand een oplossing voor?

    Bijdrager
    rburgt

    Plaatje instellen van een list moet niet met een background image maar met “list-style-image

    Bijdrager
    iBert

    Referentiesite Listamatic zegt het toch anders. List-style-image heeft te weinig mogelijkheden.

    Als ik het uit de layout, dus apart probeer werkt het wel, maar in deze context niet.

    Bijdrager
    rburgt
    ”iBert”

    Referentiesite Listamatic zegt het toch anders.

    Ik heb het net aan mijn buurman gevraagd, die zegt het ook weer anders:P Niet elke site heeft dezelfde mening/kijkpunt op dingen…. list-style-image is het element wat ervoor gemaakt is en dus in meer browsers goed weergeven zal worden, daarom had ik het geplaatst…

    List-style-image heeft te weinig mogelijkheden.

    Wat voor een mogelijkheden zou je willen hebben dan ?

    Als ik het uit de layout, dus apart probeer werkt het wel, maar in deze context niet.

    Dan zie ik het probleem niet, of kom je hier nu pas achter ?

    Bijdrager
    Dennisch

    de beste manier om een eigen bullet image te gebruiken en te positioneren voor een opsomming is het gebruik zoals ik hieronder heb gebruikt (wordt gebruikt voor de opsommingen op http://www.madeo.nl )

    #news li {

    background: url(../bullet.png) 0 6px no-repeat;
    display: block;
    padding: 0 0 0 6px;
    margin: 0;
    }

    Bijdrager
    iBert
    ”ReaLX”

    de beste manier om een eigen bullet image te gebruiken en te positioneren voor een opsomming is het gebruik zoals ik hieronder heb gebruikt (wordt gebruikt voor de opsommingen op http://www.madeo.nl )

    #news li {

    background: url(../bullet.png) 0 6px no-repeat;
    display: block;
    padding: 0 0 0 6px;
    margin: 0;
    }

    Ik heb het zo geprobeerd, maar zonder resultaat. Andere ideëen eventueel?

    Bijdrager
    Dennisch
    ”iBert”
    ”ReaLX”

    de beste manier om een eigen bullet image te gebruiken en te positioneren voor een opsomming is het gebruik zoals ik hieronder heb gebruikt (wordt gebruikt voor de opsommingen op http://www.madeo.nl )

    #news li {

    background: url(../bullet.png) 0 6px no-repeat;
    display: block;
    padding: 0 0 0 6px;
    margin: 0;
    }

    Ik heb het zo geprobeerd, maar zonder resultaat. Andere ideëen eventueel?

    Ehm, lijkt me raar dat je geen resultaat bereikt….. misschien dat het niet helemaal goed werkt voor hetgene wat jij wilt bereiken, maar dit is de manier om het zo flexibel mogelijk op te lossen. Succes naar het zoeken van een betere manier.

    Bijdrager
    Harryk

    Ik liep toevallig ook net tegen hetzelfde aan, Explorer 6 Win die afweek. Ik geef je hieronder mijn code die in ieder geval in alle browsers op mac en Expl 6 Win goed werkt. Ik herinner me wel dat die text-align: left nogal essentieel was. Misschien dat je in je declaraties iets explicieter
    .opsomming ul
    .opsomming li
    .opsomming li a
    moet gebruiken.
    Ik definieer wel een default list-style-type, indien op de url het plaatje wordt gevonden heeft die dan prioriteit.
    Verder moet je even wat omwerken. Als je mijn ID #sidebar vervangt door jouw class .opsomming ben je volgens mij een end op weg.
    Succes

    —code—
    /* OPSOMMING, jouw code */

    .opsomming
    {
    margin: 0 0 10px 0; padding: 0;
    list-style: none;
    }

    .opsomming li
    {
    margin: 0; padding: 2px 20px;
    background: url(images/layout/pijl_opsomming.gif) no-repeat 0 50%;
    }

    /*
    mijn code
    */

    #sidebar ul { font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; text-align: left; margin: 0 auto 0 0; padding-left: 0; position: relative; left: 0 }
    .lijst1 { list-style-image: url(../img/uitpijlschuin.gif) }
    .lijst2 { list-style-image: url(../img/bulletsquaresmall.gif) }
    #sidebar li { text-align: left; list-style-type: disc; margin-left: 21px; position: relative; left: 0 }
    #sidebar li a {text-align:left;}

    [mod:92397df284]
    Foutjes in css gecorigeerd
    [/mod:92397df284]

    Bijdrager
    Harryk

    Moderatie:

    Foutjes in css gecorigeerd

    Ja, je hebt in
    #sidebar li a {text-align=left;}
    Het = teken vervangen door een terechte dubbelepunt. Indien overigens browsers door deze syntaxfout de declaratie negeren betekent het tevens dat ie overbodig is…

    Verder zie ik zo snel geen foutjes die je verbeterd hebt in de gauwigheid. Toch heb ik een dubbel gevoel bij deze actie, moderator… is het dan niet beter om gewoon expliciet de tekst de tekst te laten en aangeven WAT het foutje/de foutjes zijn?
    Harry

9 berichten aan het bekijken - 1 tot 9 (van in totaal 9)

Je moet ingelogd zijn om een reactie op dit onderwerp te kunnen geven.