[...]
La seconda soluzione: l’uso di un div vuoto
Rispettando le raccomandazione della W3C, possiamo più semplicemente aggiungere un div extra con una larghezza fissa pare a quella minima dentro il nostro contenitore che risolverà il problema del min-width con IE6.
L’HTML di base:
- Codice: Seleziona tutto
<div id=”contenitore”/>
<div id=”min-width”/></div>
—il contenuto—
</div>
Le regole css:
- Codice: Seleziona tutto
#contenitore{
background-color:#ccc;
min-width:500px;
}
#min-width{
width:500px;
height:1px;
}
Link: http://css.flepstudio.org/css-tips/min-width-ie6.html
Praticamente.... Metti all'interno del tuo DIV un altro DIV (la prima soluzione che affrontavi) solo che a questo specifichi la dimensione massima (proprietà supportata da tutti i browsers) cosicchè quello più esterno non può diventare più piccolo di quello dentro....
Ho visto che è simile appunto alla tua prima soluzione, ci ho appena provato e funziona...
- Codice: Seleziona tutto
<style type="text/css">
#esterno {
background-color:#FF0000;
min-width:500px;
width: 100;
}
#interno{
background-color: #000099;
width:500px;
height:200px;
}
</style>
</head>
<body>
<div id="esterno">
<div id="interno">
</div>
</div>
ho usato dei colori strani forti e accesi cosi ridimensionando te ne accorgi subito...