Problema Firefox sono alle prime armi

[miky06]

ho un problema su firefox alcune pagine si vedono male http://www.dgviaggisrl.com/servizi.html
http://www.dgviaggisrl.com/dove_siamo.html potete aiutarmi^?

body {
margin: 10px;
padding: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #333333;
background-color: #666666;
}

h1, h2, h3 {
margin-top: 0;
padding-top: 0;
letter-spacing: -1px;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-style: italic;
color: #356AA0;
margin-right: auto;
margin-left: auto;
}

h4 {
margin: 0;
padding: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
height: 4377px;
}


p, ul {
line-height: 18px;
font-size: 11px;
}

a:link {
color: #356AA0;
}
#header #travel {
float: right;
padding: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
text-align: center;
}

#header img {
float: left;
padding: 10px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
background-color: #FFFFFF;
}


a:hover {
text-decoration: none;
}

/* Header */

#header {
width: 760px!important;
width /**/: 760px;
height: 155px;
background-repeat: repeat;
margin-top: 0;
margin-right: auto;
margin-left: auto;
padding-top: 0px;
background-image: url(images/spiaagia1%20copia.jpg);
}

#header h1 {
float: left;
width: 300px!important;
width /**/: 300px;
height: 80px;
margin: 0;
display: inline;
padding-top: 40px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 20px;
}

#header h1 a {
text-decoration: none;
display: inline;
}

#header h2 {
float: right;
width: 195px!important;
width /**/: 195px;
margin: 0;
letter-spacing: normal;
background-color: #FF7400;
background-image: url(images/img2.gif);
background-repeat: repeat-x;
padding-top: 40px;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
height: 110px;
text-align: center;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: bold;
border-top-style: double;
border-right-style: double;
border-bottom-style: double;
border-left-style: double;
border-top-color: #FF7400;
border-right-color: #FF7400;
border-bottom-color: #FF7400;
border-left-color: #FF7400;
}

#header h2 a {
text-decoration: none;
color: #FFFFFF;
float: right;
}

/* Menu */

#menu {
padding: 5px;
background: #FF7400 url(images/img2.gif) repeat-x left center;
border: 2px solid #FF7400;
}

#menu ul {
margin: 0;
padding: 0;
}

#menu li {
display: inline;
}

#menu a {
padding: 0 20px;
font-weight: bold;
color: #FFFFFF;
}

/* Content */

#content {
width: 760px!important;
width /**/: 760px;
background-color: #FFFFFF;
margin-top: 0;
margin-right: auto;
margin-left: auto;
height: auto;
}

#colOne {
float: left;
width: 559px!important;
width /**/: 559px;
height: 500px;
padding-top: 0px;
}

#colTwo {
float: right;
width: 155px!important;
width /**/: 155px;
margin-top: 0px;
clear: none;
height: auto;
background-color: #000066;
background-image: url(images/img3.gif);
background-repeat: repeat-y;
border-top-width: 2px;
border-right-width: 2px;
border-bottom-width: 2px;
border-left-width: 2px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #000066;
border-right-color: #000066;
border-bottom-color: #000066;
border-left-color: #000066;
padding: 20px;
}

#colTwo h4 {
color: #000033;
margin: 0px;
height: auto;
width: auto;
}

#colTwo ul {
margin-left: 0;
padding-left: 0;
list-style: none;
}

/* Footer */

#footer {
width: 760px!important;
width /**/: 760px;
background-color: #000066;
height: auto;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
}
input.user {
background-image: url(NomeImmagine.png/gif/jpg);
background-repeat: no-repeat;
background-position:left;
background-color:#FFFFFF;
width:290px!important;
width /**/: 290px;
color: #993300;
padding:3px 5px 3px 19px;
font-size: 1em;
font-family: 'trebuchet ms', sans-serif;
border: 1px solid #999999;
height: 27px;
}

[Inverter]

sbagli il modo di pensare: internet explorer sbaglia, firefox interpreta in modo corretto il codice.

Comunque, hai provato a mettere il clear al footer?

[dupardipal]

Concordo con Inverter:
aggiungi clear:both nel footer... sicuramente non lo dimenticherai la prossima volta

leggi qui: http://css.html.it/guide/lezione/39/...y-float-clear/

Come puoi vedere, explorer vuole aiutare l'utente risolvendo "gli errori" di visualizzazione, ma danneggia lo sviluppatore...

[miky06]

allora grazie tanto per l'aiuto che mi state dando allora ho messo clear:both nel footer vi posto il codice di nuovo il footer su firefox ora e' sceso ma il content no.... non so perke ho provato a mettere anche li clear:both ma niente aiutoooooo
le pagine sono sempre http://www.dgviaggisrl.com/servizi.html
http://www.dgviaggisrl.com/dove_siamo.html


body {
margin: 10px;
padding: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
color: #333333;
background-color: #666666;
}

h1, h2, h3 {
margin-top: 0;
padding-top: 0;
letter-spacing: -1px;
font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
font-style: italic;
color: #356AA0;
margin-right: auto;
margin-left: auto;
}

h4 {
margin: 0;
padding: 0;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 12px;
font-weight: bold;
height: 4377px;
}


p, ul {
line-height: 18px;
font-size: 11px;
}

a:link {
color: #356AA0;
}
#header #travel {
float: right;
padding: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
text-align: center;
}

#header img {
float: left;
padding: 10px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
background-color: #FFFFFF;
}


a:hover {
text-decoration: none;
}

/* Header */

#header {
width: 760px!important;
width /**/: 760px;
height: 155px;
background-repeat: repeat;
margin-top: 0;
margin-right: auto;
margin-left: auto;
padding-top: 0px;
background-image: url(images/spiaagia1%20copia.jpg);
}

#header h1 {
float: left;
width: 300px!important;
width /**/: 300px;
height: 80px;
margin: 0;
display: inline;
padding-top: 40px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 20px;
}

#header h1 a {
text-decoration: none;
display: inline;
}

#header h2 {
float: right;
width: 195px!important;
width /**/: 195px;
margin: 0;
letter-spacing: normal;
background-color: #FF7400;
background-image: url(images/img2.gif);
background-repeat: repeat-x;
padding-top: 40px;
padding-right: 0;
padding-bottom: 0;
padding-left: 0;
height: 110px;
text-align: center;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 11px;
font-weight: bold;
border-top-style: double;
border-right-style: double;
border-bottom-style: double;
border-left-style: double;
border-top-color: #FF7400;
border-right-color: #FF7400;
border-bottom-color: #FF7400;
border-left-color: #FF7400;
}

#header h2 a {
text-decoration: none;
color: #FFFFFF;
float: right;
}

/* Menu */

#menu {
padding: 5px;
background: #FF7400 url(images/img2.gif) repeat-x left center;
border: 2px solid #FF7400;
}

#menu ul {
margin: 0;
padding: 0;
}

#menu li {
display: inline;
}

#menu a {
padding: 0 20px;
font-weight: bold;
color: #FFFFFF;
}

/* Content */

#content {
width: 760px!important;
width /**/: 760px;
background-color: #FFFFFF;
margin-top: 0;
margin-right: auto;
margin-left: auto;
height: auto;
clear:both;
}

#colOne {
float: left;
width: 559px!important;
width /**/: 559px;
height: 500px;
padding-top: 0px;
}

#colTwo {
float: right;
width: 155px!important;
width /**/: 155px;
margin-top: 0px;
clear: none;
height: auto;
background-color: #000066;
background-image: url(images/img3.gif);
background-repeat: repeat-y;
border-top-width: 2px;
border-right-width: 2px;
border-bottom-width: 2px;
border-left-width: 2px;
border-top-style: solid;
border-right-style: solid;
border-bottom-style: solid;
border-left-style: solid;
border-top-color: #000066;
border-right-color: #000066;
border-bottom-color: #000066;
border-left-color: #000066;
padding: 20px;
}

#colTwo h4 {
color: #000033;
margin: 0px;
height: auto;
width: auto;
}

#colTwo ul {
margin-left: 0;
padding-left: 0;
list-style: none;
}

/* Footer */

#footer {
width: 760px!important;
width /**/: 760px;
background-color: #000066;
height: auto;
margin-top: 0;
margin-right: auto;
margin-bottom: 0;
margin-left: auto;
clear:both;
}
input.user {
background-image: url(NomeImmagine.png/gif/jpg);
background-repeat: no-repeat;
background-position:left;
background-color:#FFFFFF;
width:290px!important;
width /**/: 290px;
color: #993300;
padding:3px 5px 3px 19px;
font-size: 1em;
font-family: 'trebuchet ms', sans-serif;
border: 1px solid #999999;
height: 27px;
}

[mucu]

prova a mettere il footer nel content

[miky06]

se metto il div footer nel div content dall'html si scassa tutto il lato destro se ne va a sinistra che posso fare^?

[Inverter]

se metti il footer nel content devi assicurarti di aver tolto il clear (o un eventuale float) allo stile del footer

[miky06]

saro' cretino... ma non riesco... non e' che qualcuno puo' incollarmi il codice perke ho provato a metetere il footer nel content ma non va bene uguale forse sbagli a incollare.. il codice... se potete mi salvate la vita grazie

[gengix]

Prova a dichiarare queste regole:

#content:after {
content:".";
display:block;
visibility:hidden;
clear:both;
height:0;
}
*html #content{
height:1%;
}

O come ha detto Mucu tagli il div footer e lo incolli dentro il content.
Il mio consiglio è se hai tempo di rifare la struttura ed eliminare diverse cose, ormai deprecate, come l'utilizzo della proprietà font face, l'utilizzo delle tabelle per impaginare ecc...

Segui questo modello:

http://css.html.it/guide/lezione/67/...menti-di-base/

Leggendoti tutta la sezione.

[miky06]

mettendo questo codice niente non e' che puoi prendere e incollarmi il codice esatto che devo mettere levando quello errato?