Visualizzazione dei risultati da 1 a 3 su 3
  1. #1

    Lista puntata, problema con IE

    Ciao,
    ho creato un sito semplice semplice e nonostante questo IE riesce a darmi delle rogne...
    Come potete vedere a questa pagina con IE (compreso IE7 il padding sembra raddoppiato e la prima voce della lista ha un rientro ancora maggiore...
    Per una volta avrei voluto evitare un foglio di stile apposito per IE, qualcuno sa aiutarmi?

    Questo il CSS che gestisce l'elenco puntato:

    #testi li {
    background: url(images/tick.gif) 0 50% no-repeat;
    padding-left: 20px;
    font-weight: bold;
    line-height: 20px;
    margin-top:0;
    margin-left: 20px;
    }
    #testi ul {
    list-style: none;
    display:inline;

    }

    A proposito, esiste un sistema per colllocare il marcatore di lista sempre a fianco della prima riga anche quando la voce si dispone su due righe?

  2. #2
    Utente di HTML.it L'avatar di hcka
    Registrato dal
    Oct 2002
    Messaggi
    435
    Per la seconda domanda (che il segno dell'elemento di lista venga visualizzato a lato della prima riga), il problema è che tu non stai utilizzando il list-style ma il background.
    Questo puoi risolverlo in due modi:
    • il background di #testi li va messo a 0 0 e non 0 50% , con quel 50% ti viene visualizzato al 50% dell'altezza, quindi centrato nel caso di più righe.
    • togli il background a #testi li, togli padding-left da #testi li e invece a #testi ul metti list-style-image: la tua immagine, quindi list-style-image: url('images/tick.gif');

    Easy, no?

    Per la prima domanda invece, dovrebbe essere perché Internet Explorer raddoppia le dimensioni dei margin. Prova a gestire con i padding, altrimenti utilizza degli hack per dimezzare i margin con IE (io solitamente utilizzo le regole di legame padre>figlio)...

  3. #3
    Già, non ci avevo pensato. In effetti avendo una voce su due righe sembra la soluzione migliore anche se pare che "list-style-image" non gestisca bene il posizionamento verticale a fianco della voce così come fa invece backround:50%.
    Vorrei evitare gli hack, eventualmente prevferisco un CSS dedicato.
    Comunque ora provo con una variante un pò grossolana: imposto un margin-left per il div testi e e lo tolgo da #testi li e poi tolgo il padding anche al paragrafo. Ciò che mi inquieta è quell'anomalo rientro della prima voce
    (seguono maledizioni varie a IE in tutte le sue versioni....)

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  
Powered by vBulletin® Version 4.2.1
Copyright © 2026 vBulletin Solutions, Inc. All rights reserved.