problema di layout in FF

[fricke]

Salve a tutti, è il mio primo post qui, sto cercando di rifare un sito con i CSS, riprendendolo da zero... ho fatto un layout con un header, un content centrale, ed un footer, in modalità tableless (scusate ma non so se ho abbastanza proprietà di linguaggio!).

il content ed il footer hanno un'istruzione per il bordo, del tipo

border: solid 1px #FFFFFF;

per il bordo bianco. solo che, mentre in IE7 si vede bene il bordo, in FF succede che, solo per il content i bordi laterali non si vedono per niente e quelli top e bottom sono attaccati, ignorando del tutto il contenuto della pagina..

non so se si capisce

se, viceversa, imposto l'altezza del content, del tipo

height: 400px;

mi disegna un riquadro di 400px (con tutti i bordi al posto giusto, ma ignorando il contenuto, anche qui..

come faccio a creare il bordo del content, proprio come succede in IE7???

[Myaku]

puoi postare un link così da vedere il codice completo?

[fricke]

QUESTO è TUTTO IL CODICE!

spero tu possa aiutarmi...


body
{
background: #800000;
color: #FFFDD0; /*il colore del testo*/
margin: 10px 0px 10px 0px;
}

div
{
font-size: 10pt;
font-family: verdana;
moz-box-sizing: padding-box;
}

/* ----- ----- ----- ----- ----- ----- */

#HEADER

{
text-align: center;
width: 1024px;
height: 81px;
border: solid 0px #F0DC82;

}

#LOGO
{
float: left;
width: 144px;
}

#TITLE
{
float: left;
width: 878px;
padding-top: 19px; /* imposta il titolo al centro del TITLE table*/
}

#MAIN
{
text-align: center;
width: 944px;
border: solid 1px #F0DC82;
}



#MENU
{
background-image: url('../images/riga.gif'); /*la riga del menu*/
background-repeat: repeat-y; /*ripete l'immagine della riga menu in verticale*/
text-align: left;
color: #F0DC82; /*color CAMOSCIO*/
float: left;
width: 144px;
}

#CONTENT
{
float: left;
width: 798px;
}

#FOOTER
{
font-size: 9pt;
clear: left;
width: 1024px;
border: solid 1px #F0DC82;
border-bottom: solid 0px #F0DC82;
}

/* --- --- --- --- --- -- --- --- --- --- --- --- */
/* --- --- --- PER nascondere i SOTTOMENU --- --- */
/* --- --- --- --- --- -- --- --- --- --- --- --- */


.menu {display:none}

/* --- --- --- --- --- -- --- --- --- --- --- --- */
/* -- impostazioni caratteri e colori per link -- */
/* --- --- --- --- --- -- --- --- --- --- --- --- */

a
{
color: #FFFF00;
font-size: 10pt;
font-family: verdana;
}

a:hover
{
color: #FFFFFF;
font-size: 11pt;
font-family: verdana;
}

a:visited
{
color: #FFFF00;
size: 11pt;
font-family: verdana;
}



a.MENUpair
{
color: #FFFDD0;
font-size: 10pt;
font-family: verdana;
}

a.MENUpair:hover
{
color: #F0DC82; /*color CAMOSCIO*/
font-size: 11pt;
font-family: verdana;
}

a.MENUpair:visited
{
color: #FFFDD0;
size: 10pt;
font-family: verdana;
}

a.MENUunpair
{
color: #F0DC82; /*color CAMOSCIO*/
font-size: 10pt;
font-family: verdana;
}

a.MENUpair:hover
{
color: #FFFFFF;
size: 11pt;
font-family: verdana;
}

a.MENUpair:visited
{
color: #F0DC82; /*color CAMOSCIO*/
font-size: 10pt;
font-family: verdana;
}

[Myaku]

magari a sapere anche come si relaziona sull'html, sennò facciamo che andiamo alla cieca ...

prima di tutto, ti segnalo però che il codice css non è valido

per la prossima, invece, usa il tag # per postare il codice, che c'ho già la vista calante di mio e quel poco che m'è rimasta me la voglio conservare bene

[fricke]

Ciao, provo il tag che mi hai consigliato, per vederne l'effetto.. non volevo ledere la tua vista :)

questo è il link della pagina connessa al foglio di stile:

SITO

e questo è il foglio di stile

STILE

scusa la mia recalcitranza a postare subito i link, ma spero che, poichè è un sito commerciale, non sia bollato come pubblicità..


a proposito, ma c'è questo pericolo??? :master:

grazie!

[Myaku]

dunque, come prima cosa dovresti correggere gli errori sul codice (sia html che css). se sono validati, è più facile individuare dove è il problema.
Ancora più semplice, se usi solo stili esterni.

Tra l'altro:

<link rel="stylesheet" type "text/css" href="../css/style2.css">

qui c'è un errore, hai perso un pezzetto per strada:

type="text/css"

sistemate queste cose, prova anche a dichiarare i bordi nel modo seguente:

border: 1px solid #fff;

ovvero nell'ordine: spessore, tipo, colore



ps. a che ti serve dichiarare colore ecc. su un bordo settato a 0?
pps: il doctype è importante!!

[fricke]

Ciao!

grazie per le dritte, ho usato il validatore css, mi sembra di aver messo a posto il tutto...

per il colore nel bordo nullo, hai ragione... eh.

comunque il mio "problema" principale non si è risolto... vedi che non mi fa vedere i margini su firefox?? tra l'altro, se noti, nel footer, l'ultimo in basso, i margini laterali me li fa vedere... non è che ci daresti ancora un occhiata???

e, riguardo ai DOCTYPE!... se solo sapessi cosa fossero e come usarli davvero lo farei, perchè non c'ho capito nulla, pur avendo leggerissimamente intuito che sono importanti..

:quote: