box model

joey.santiago

box model

ho un dubbio sul box model ed in particolare non so se devo usare lo hack per IE o no... purtroppo non posso provare a vedere la mia pagina con IE 5.5, quindi chiedo lumi.

Questo è il mio css per creare la colonna navigation. Lo sfondo è affidato al div che contiene il div navigation ed è una semplicissima immagine larga 200 px. Naturalmente anche la navigazione dovrebbe avere larghezza totale di 200 px.

quel che mi chiedo è: dato che metto al tag ul 5px di margine a sinistra ed ai tag li 15px di padding a sinistra (per fare spazio ad un'iconcina che mi indica la pagina corrente), devo usare un hack per dare una dimensione diversa al div navigation? spiego meglio: dato che uso questi margin e padding per degli elementi interni al div, devo sottrarre questi 20px totali alla dimensione del div, e mantenere i 200px di larghezza solo per explorer?

div#navigation{
    float: left;
    margin:0;
    padding:0; 
**    width: 200px;**
    background: transparent;
    line-height:1.3em;
    text-align: left;
    color: #333300;
    }
div#navigation ul{
    list-style-type: none;
    margin:5px 0;
**    margin-left:5px;**
    padding:0;
    }
div#navigation li{
**    padding-left:15px;**/*fa spazio all'icona che segnala l'activelink*/
    }
div#navigation a{
    color:#333300;
    display:block;
    text-decoration: none;
    }
 div#navigation a:focus, div#navigation a:hover, div#navigation a:active{    
    background-color:;
    color:#CCFF99
    }
div#navigation li#activelink{
    color:#333300;
    background: url(iconaDuea.bmp) left center no-repeat;
    font-weight: bold;
    text-decoration: none;
    }

claudioweb

Ciao
@joey santiago said:

purtroppo non posso provare a vedere la mia pagina con IE 5.5, quindi chiedo lumi. Perchè? Hai una versione più recente??
Anzichè cercare di offrirti una soluzione per questo caso particolare, ti offro una valida alternativa, che potrà tornarti utile sempre

Prova tu stesso a vedere come si vede su IE 5.5

Leggi qui

http://www.apogeonline.com/webzine/2004/06/22/01/200406220101

Ciao

joey.santiago

grazie mille... mi sembra un po' complesso, ma ci proverò...

posso però chiederti anche un aiuto per questo caso particolare? In genere nei vari tutorial sul box model parlano di questioni meno complesse di questa e non capisco se il mio codice crea problemi o no...

claudioweb

@joey santiago said:

posso però chiederti anche un aiuto per questo caso particolare? In genere nei vari tutorial sul box model parlano di questioni meno complesse di questa e non capisco se il mio codice crea problemi o no... Il problema è che non ho ben capito che intendi...

Fammi vedere una pagina completa e dimmi quale problema devo controllare se c'è o no
@joey santiago said:

grazie mille... mi sembra un po' complesso, ma ci proverò... Comunque non c'era nulla di complesso...
In pratica dice che per usare IE 5.5 basta scaricare questo file e scompattarlo...
http://lambcutlet.org/downloads/ie55sp2_nt.zip
Più semplice di così

joey.santiago

perfetto, visto con ie 5.5... va abbastanza bene, per fortuna... c'è solo qualche ritocco da fare (il problema dei 3 px di bordo aggiunti alle immagini...)

mhm, quindi la colonna della navigazione dovrebbe andare bene così com'è... giusto?

joey.santiago

hai ragione, è che l'articolo diceva molto più di quanto avevo bisogno!

vorrei sapere se, a livello teorico, dichiarare un div largo 200px e poi aggiungere dei padding e margin a degli elementi interni a questo div di fatto crei qualche problema al box model. Intendo dire: i contenuti del mio div id="navigation" devono essere larghi 200px. Se io quindi aggiungo a div#navigation ul un margin-left di 5px ed a div#navigation li un padding-left di 15px, "sposto" di fatto il contenuto del div navigation di 20px a destra, oppure sottraggo 20px alla larghezza del div?

spero di essere stato un po' più chiaro... ti ringrazio moltissimo