Pagina sfalsata su Firefox ed errore CSS

[Mauro gol]

questa è la pagina incriminata:

http://www.mauromercuri.com/presentazione.htm

se cliccate su prodotti potete notare lo sfasamento che si presenta a seconda della dimensione della finestra del browser VVoVe: se metto tutto schermo sfasa...

le pagine rchiamano dei div in un foglio di stile separato...

per la prima pagina il relativo div si chiama "presentazione" mentre per la seconoda pagina il div relativo si chiama "generale"

se faccio la convalida per il foglio CSS viene fuori il seguente errore:

Line: 0

Parse Error - a.link1:link { text-decoration: none; font-style: oblique; font-weight: bold; font-size: 18px; color: #FFCC00; }

questo è il codice CSS

@charset "iso-8859-1"
/* CSS Document */

a.link1:link { text-decoration: none; font-style: oblique; font-weight: bold;  font-size: 18px; color: #FFCC00; }

a.link1:visited { text-decoration: none; font-style: oblique; font-weight: bold;  font-size: 18px; color: #FFCC00; }

a.link1:hover { text-decoration: none; font-style: oblique; font-weight: bold;  font-size: 18px; color: #CCCCCC; }

a.link1:active { text-decoration: none; font-style: oblique; font-weight: bold;  font-size: 18px; color: #FFCC00;}

a.link1 { text-decoration: none; font-style: oblique; font-weight: bold;  font-size: 18px; color: #FFCC00; }


a.link2:link { text-decoration: none; font-style: oblique; font-weight: bold;  font-size: 13px; color: #FFFFFF; }

a.link2:visited { text-decoration: none; font-style: oblique; font-weight: bold;  font-size: 13px; color: #FFFFFF; }

a.link2:hover { text-decoration: underline; font-style: oblique; font-weight: bold;  font-size: 13px; color: #FFFFFF; }

a.link2:active { text-decoration: none; font-style: oblique; font-weight: bold;  font-size: 13px; color: #FFFFFF;}

a.link2 { text-decoration: none; font-style: oblique; font-weight: bold;  font-size: 13px; color: #FFFFFF; }


body {
font-family: Arial, Helvetica, sans-serif;
font-size: 13px;
font-style: normal;
background-color: #000000;
color: #CCCCCC;
text-align: center;
}

.Stile1 { color: #FFCC00; }
.Stile2 { color: #CCCCCC; }

div.index { 
border: none;
width: 760px;
height: 500px;
margin-left: auto;
margin-right: auto;
background-image: url(immagini/sfondo_index.JPG);
}
div.presentazione { 
border: none;
width: 760px;
height: 700px;
margin-left: auto;
margin-right: auto;
background-image: url(sfondo_presentazione.JPG);
}
div.generale { 
border: none;
width: 760px;
height: 300px;
margin-left: auto;
margin-right: auto;
background-image: url(sfondo_generale.JPG);
}
div.menu_prodotti { 
border: none;
width: 760px;
height: 600px;
display: block;
margin-left: auto;
margin-right: auto;
background-image: url(immagini/sfondo_prodotti.JPG);
text-align: left;
}
div.prodotti { 
width: 760px;
display: block;
margin-left: auto;
margin-right: auto;
text-align: justify;
}

[Mauro gol]

volevo sapere una cosa:

margin-left e margin-auto sono impostati su auto

se li volesse impostare manualmente ed ottenere il div centrale che valori dovrei mettere ?

un altra cosa:

che funzione svolge il comando "display: block;" ?

ultima cosa :

l'errore che ho postato nel topic precedente, non ho idea di come si possa risolvere, lo riscrivo:

Line: 0

Parse Error - a.link1:link { text-decoration: none; font-style: oblique; font-weight: bold; font-size: 18px; color: #FFCC00; }

[Jerry Masslo]

per l'errore

a me dà un'altra risposta il validatore da cui si evince che si toglie la riga del charset poi fa il bravo, infatti, è così.

i margin laterali che hanno che no vanno con auto? perchè per averli centrati manualmente a tutte le risoluzioni occorrerebbe avere il div da centrare in percentuale o altrimenti se in pixel con un position:relative e un gioco di rientri col margin e il left.

i principali valori e più usati che può assumere display sono:

block inline e none

è semplice da capire ma difficile da spiegare, a parte none che significa che l'emento non verrà mostrato sullo schermo e non occuperà spazio, praticamente come se non ci fosse o quasi, gli altri se usi google te lo spiegano per benino.



questo il primo risultato che dà a me

[Mauro gol]

per i primi due problemi ok...

per il comando display non è che ho capito molto...

l'ho levato e non vedo cambiamenti!

[Jerry Masslo]

Originariamente inviato da Mauro gol
per i primi due problemi ok...

per il comando display non è che ho capito molto...

l'ho levato e non vedo cambiamenti!

se un elemento è già block di default tipo un div metterlo o no non fa differenza, per la spiegazione più di quella del link che ti devo spiegare? un esempio: un'immagine o uno span è di default un elemento inline che si contrappone a block, cioè se per esempio infili in mezzo al testo un'immagine il testo si disporrà a lato perchè starà sulla stessa riga, mentre se dai all'immagine block allora l'immagine prenderà tutto lo spazio disponibile orizzontalmente e il testo andarà sotto.

block si usa o per modificare un elemento che normalmente sarebbe inline o in javascript in congiunzione con none cioè, display:block o inline e l'elemento è visibile display:none e l'elemento non sarà più visualizzato e non occuperà spazio nella pagina.

[Mauro gol]

ok ho capito!

in effetti nell'impostazione che avevo prima mi serviva, ora non più...

grazie!