Sfondo non visualizzato con FF

**Valeria75_bis** · 07-10-2007, 20:43

Ciao, ho una struttura che viene visualizzata correttamente con IE e non con FF

nel senso che con FF non vedo l'immagine di sfondo in tutta l'area (non si estende in verticale) ma vedo solo l'immagine nella posizione iniziale... praticamente l'immagine non si replica verticalmente... ho provato ad inserire un backgroup-repeat ma senza successo

con IE è tutto OK

#innen {
background-image: url(images/bginnen.gif); /* immagine che viene visualizzata solo una volta e non replicata con FF*/
background-repeat:repeat;
background-repeat: repeat-y;
position: relative;
width: 800px;
clear: both;
float: center;
padding-top: 10px;
}

#innen .leftcolumn {
background-color: inherit;
position: relative;
width: 190px;
float: left;
margin-left: 34px;
display: inline;
}

#innen .content {
background-color: #ffffff;
position: relative;
width: 555px;
float: left;
margin-left: 10px;
}

<div id="innen">

<div class="leftcolumn">
{include file="leftcolumn.tpl"}
</div>

<div class="content">
{$rendered_page}

{$modosdate_main}

</div>
</div>

**fcaldera** · 07-10-2007, 23:36

codice:

#innen {
background-image: url(images/bginnen.gif); /* immagine che viene visualizzata solo una volta e non replicata con FF*/
background-repeat:repeat;
background-repeat: repeat-y;
position: relative;
width: 800px;
clear: both;
float: center;
padding-top: 10px;
}

non mi stupisco che firefox si rifiuti di gestire correttamente un blocco a cui viene dato float: center visto che tale valore non esiste. Float accetta come valori left oppure right.

Inoltre sospetto che sia il mancato autoclearing su Firefox a causare il problema: aggiungi height: auto e overflow: hidden alle regole per #innen

**Valeria75_bis** · 08-10-2007, 20:55

Non è cambiato niente

**fcaldera** · 08-10-2007, 20:56

posta un link alla pagina

**revenge1963** · 09-10-2007, 08:27

Originariamente inviato da Valeria75_bis
Non è cambiato niente

Ciao,
il problema principale è che in #innen hai messo clear: both in quanto il float contenitore che ha lo sfondo deve contenere gli altri div float altrimenti lo sfondo no si espande.
Ti metto il codice modificato al volo, perdona la rozzezza ;-)

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html><head>
<style>
#innen {
background-color: #BDBDBD;/*url(images/bginnen.gif);*/
background-repeat:repeat;
background-repeat: repeat-y;
/*position: relative; */
width: 800px;
/*clear: both; */
float: left;
padding-top: 10px;
}

#innen .leftcolumn {
background-color: inherit;
position: relative;
width: 190px;
float: left;
margin-left: 34px;
display: inline;
}

#innen .content {
background-color: #ffffff;
position: relative;
width: 555px;
float: left;
margin-left: 10px;
}
</style>
</head>

<body>
<div id="innen">

<div class="leftcolumn">
UGOOOOOOOOOOOOOOOOO
</div>

<div class="content">
CIROOOOOOOOOOOOOOOOOOOOOOO

CIROOOOOOOOOOOOOOOOOOOOOOO

</div>
</div>
</body>
</html>

Spero ti sia utile

Discussione: Sfondo non visualizzato con FF

Strumenti discussione

Ricerca discussione

Visualizza

Sfondo non visualizzato con FF

Permessi di invio