Css e Firefox: non mi vede alcuni elementi

**gnappoide** · 02-08-2006, 14:00

Ciao a tutti, sono stato un pò titubante nell'aprire un nuovo 3d, perchè ho cercato nel forum ma non sono riuscito a trovare una soluzione al mio problema.
Premesso che sono molto ignorante in materia, infatti sto cercando di imparare a costruire i layout tramite css. Sto lavorando con varie guide sotto mano però c'è un problema che non riesco a risolvere.

Questo è il codice del mio Css

codice:

body{
			background-image: url("../images/logo.jpg"); 
			font-family:  Verdana, Arial, sans-serif; 
			font-size: 76%;
			text-align: center;
			
}



#container{
        background-color:#0000FF;
		position: relative;
		height: 590px;
		width:  780px;
		margin: 0px auto; /* 'top' 'right' 'bottom' 'left'  */
		text-align:left;
		border-style:solid; 
		border-color:#000000; 
		border-width:1px;
}

#header{
		background-color: #A60808;
		position: relative;
		top:0px;
		left: 0px;
		right: 0px;
		height:80px;
		width: 780px;
		width:780px;
		width:780px;
		margin: 0px auto; /* 'top' 'right' 'bottom' 'left'  */
}

#content{
        background-color:#00CC66;
		position: absolute;
		top: 80px;
		width: 600px;
		left:0px;
		
	
}

#navigation{
    background-color:#FF6699;
    position: absolute;
	top: 80px; /*header*/
	right: 0px;
    width: 180px;
	width:180px;
	width:180px;  
	margin: 0px 0px 0px 0px; /* 'top' 'right' 'bottom' 'left'  */
}

#footer{
       background-color:#003366;
	   position:absolute;
	   bottom: 0;
	   left:0px;
	   height: 8px;
	   width: 780px;
	   width:780px;
	   width:780px;
	   text-align:center;
	   margin: 0px auto; /* 'top' 'right' 'bottom' 'left'  */
}

Mentre la pagina html che utilizza il css è:

codice:

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>prova</title>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />

<link rel="stylesheet" href="prova_files/style.css" type="text/css" >
</head>

<body> 

<div id="container">
<div id="header"></div>
<div id="content"></div>
<div id="navigation"></div>
<div id="footer"></div>
</div>
</body>
</html>

Per avere un'idea del layout ho dato colori belli tosti agli elementi, perchè costantemente guardo i risultati attraverso IE e FF.
Il mio problema è che con IE vedo tutti gli elementi posizionati giusti, mentre con FF non mi visualizza il #navigation e il #content
Ripeto la pagina è molto scrausa proprio perchè sto cercando di avere dimestichezza con i css per poi fare qualcosa di molto più gradevole.
Se potete dirmi dove sbaglio mi fareste un grande favore

Grazie

**Mich_** · 02-08-2006, 14:25

I browser sono autorizzati ad ignorare (completamente) i blocchi vuoti.
Prova ad inserire almeno un o spazio bianco dentro ogni oggetto.

**raozuzu** · 02-08-2006, 15:17

Prova ad inserire qualcosa tipo
Facci sapere!

**gnappoide** · 02-08-2006, 17:23

Funziona...
Sono proprio un beota

Mi ha fregato il fatto che IE mi facesse vedere bene il layout, mentre Firefox no.
Ma devo mettermi in testa che l'Explorer fa sempre quello che gli pare...

Grazie 1000

In ogni caso tra qualche giorno sarò di nuovo qua

**luca_ermejo** · 09-08-2006, 11:33

Scusatemi ma siccome anche io ho dei problemi con firefox... mi potreste dire che cosa intendete con blocchi vuoti? Magari è una c+++++ ma non l'ho capito...

Ciao e grazie,
Luca

**Francis87** · 09-08-2006, 11:39

codice:

<div></div>

è un blocco vuoto.

per far sì che i browser visualizzino quella roba, devi inserirci qualcosa:

codice:

<div>a</div>
<div></div>

**luca_ermejo** · 09-08-2006, 12:01

Allora avevo capito, non è quello il mio problema....

Non riesco a mettere in linea il contenuto di un div (#footer) con il suo contenuto (img e p); o meglio: Con internet explorer riesco a farlo funzionare ma firefox non ne vuole sapere.

Codice PHP:


#footer {

    background: url(immagini/footer.jpg) no-repeat top left;

    float: left;

    margin-top: 50px;

    margin-left: 8px;

    height: 35px;

    width: 760px;

}

#footer p {

    font: 10px Verdana, Arial, Helvetica, sans-serif;

    text-align: right;

    float: right;

    margin-top: 5px;

    margin-bottom: 0px;

    color: #476db5;

    display: inline;

}

#footer img {

    margin-left: 15px;

    margin-top: 2px;

    border: none;

}

Anche dando displat: inline; a #footer la situazione non muta.

Spero in un vostro prodigioso aiuto :maLOL:

Ciao e grazie,
Luca

**raozuzu** · 09-08-2006, 14:28

Forse dovresti aprire una nuova discussione!
Comunque prova a fare così: (da quello che ho capito vuoi mettere due div opposti.no?)

----
<div>
<div style="text-align: right; float: right; padding: 0.5em;"></div>
<div style="text-align: left; padding: 0.5em;"></div>
</div>

**luca_ermejo** · 09-08-2006, 14:30

Ragazzi ho già risolto creando 2 div interni a #footer uno per la parte di destra (paragrafo) e l'altro per quella di sinistra (le immagini).

Ora mi è rimasto solo un problema irrisolto... una parte del menu "di testa" (un menu orizzontale) che non ne vuole sapere di allinearsi in basso (ho una figura di sfondo e il meu non si vuole allineare infondo al div.... che nervi sto firefox...

Ciao,
Luca

Discussione: Css e Firefox: non mi vede alcuni elementi

Strumenti discussione

Ricerca discussione

Visualizza

Css e Firefox: non mi vede alcuni elementi

Permessi di invio