Tem-Trentco - visualizzazione errata del top menu su IE

[elenix]

Nel mio sito koogar.comli.com utilizzo il template tem trenco. 
In locale la visualizzazione della home page funziona correttamente sia con Modzilla che con IE, on line, invece, IE visualizza il top menù tutto a sinistra, in una posizione non contemplata (e non visualizzo nemmeno il cambio di colore dei link attivati, ma questo nemmeno con Modzilla ma facciamo una domanda alla volta ))).
Mi sapete suggerire perchè? Come posso risolvere il problema?
Grazie

[sudoku]

aggiungo anche la modifica di posizione (da sx firefox3 a dx con IE7) del portfolio. Il css cosa dice di IE?

[elenix]

...

[elenix]

Ma perchè in locale (con apache) visualizz tutto bene anche IE?

[sudoku]

quello che hai messo non è il file template.css 

[elenix]

Le righe che interessano il menu top solo le ultime.
Mi pare che non si faccia in alcun modo riferimento a IE.


BODY#body{
   margin:0;
   padding:0;
   text-align: center;
   background: #000;
}

body, td, th, tr, p, div {
   font-family: Arial, Helvetica, sans-serif;
   font-size: 11px;
   color: #333;
   line-height: 145%;
}

#home_module div,
#home_module p {
   color: #666;
}

#right div,
#right p {
   color: #fff;
}

.moduletable {
   margin: 0;
   padding: 10px;
}

#content .moduletable {
   padding-left: 0;
}

p {
   margin:0;
   padding: 10px;
   padding-left: 0;
}

#left .moduletable,
#left .moduletable_text,
#left .moduletable_menu {
   padding-left: 10px;
}

#wrapper {
   position: relative;
   width: 740px;
   margin: 0 auto;
   text-align: left;
}

#header {
   position: relative;
   height: 110px;
}

#logo {
   position: absolute;
   top: 60px;
   left: 0;
   width: 210px;
   height: 120px;
}

#menu {
   position: absolute;
   right: 190px;
   bottom: 10px;
}

#wrapper_content {
   float: left;
   width: 537px;
   background: #fff;
   padding-top: 10px;
}

#right {
   width: 200px;
   float: left;
   padding-top: 115px;
}

#right .moduletable {
   padding-left: 0;
}

#right p {
   padding: 10px;
}

#home_img {
   width: 535px;
   height: 388px;
   text-align: center;
}

#home_module {
   float: right;
   width: 315px;
}

#in_img {
   height: 115px;
   padding: 10px;
   padding-top: 0;
}

#left {
   float: left;
   width: 200px;
}

#content {
   float: left;
   width: 300px;
}

#content-padding {
   padding: 10px;
}

#footer {
   text-align: left;
}

#logo img {
   display: block;
}

.space {
   height: 50px;
}

.clear {
   clear: both;
}


/* GENERAL PURPOSE STYLES */

a:link,
a:active,
a:visited {
   color: #9B0F05;
   text-decoration: none;
}

a:hover {
   text-decoration: underline;
}

#header2 .moduletable {
   padding: 0;
   margin: 0;
}

.inputbox {
   margin-right: 5px;
   font-family: Verdana, Arial, Helvetica, sans-serif;
   font-size: 10px;
   color: #666;
   border: 1px solid #ddd;
}

.sectiontableentry1 {
   background-color: #fff;
}

.sectiontableentry2 {
   background-color: #f9f9f9;
}

.small {
  font-size: 9px;
  text-decoration: none;
  font-weight: normal; 
}

form {
   padding: 0;
   margin: 0;
}

#footer a,
#footer a:link,
#footer a:visited,
#right a:link,
#right a:visited  {
   color: #999;
}

#footer a:hover {
   text-decoration: underline;
}

.componentheading,
.contentheading {
   font-size: 13px;
   color: #E13D0C;
   font-weight: bold;
   padding: 0;
   margin: 0;
   padding-bottom: 5px;
   text-transform: lowercase;
}


/* new tags */

h1, h2, h3, h4 {
   margin: 0;
   padding: 10px;
   padding-bottom: 0;
   padding-left: 0;
}

h1 {
   font-size: 14px;
}

h2 {
   font-size: 13px;
   color: #333;
}

h3 {
   font-size: 12px;
}

#left h3 {
   padding-right: 0;
   padding-bottom: 5px;
   text-transform: lowercase;
}

#right h3 {
   background: url(../images/right_h3.jpg) no-repeat left top;
   padding: 5px;
   padding-left: 10px;
   text-transform: lowercase;
   height: 24px;
}

#footer h3 {
   display: none;
}

h4 {
   font-size: 11px;
   color: #333;
}

ul {
   margin: 2px;
   padding: 6px;
   padding-left: 15px;
}

li {   
   list-style: none;
   padding-left: 1px;
   line-height: 150%;
}

#content li {
   list-style-image: url(../images/arrow.png);
}

ul.arrow1 li,
ul.arrow2 li {
   padding-left: 5px;
   padding-bottom: 2px;
   padding-top: 2px;
}

ul.arrow1,
ul.arrow2  {   
   line-height: 150%;
   padding-bottom: 3px;
   margin-top: 2px;
}

ul.arrow1 li {   
   list-style-image: url(../images/arrow1.jpg);
}

ul.arrow2 li {
   list-style-image: url(../images/arrow2.jpg);
}

#left ul {
   margin: 0;
   padding: 0;
   padding-left: 10px;
}

#left ul li {
   margin: 0;
   padding: 0;
   list-style-type: none;
   list-style-image: none;
}

#left ul li a,
#left ul li a:link,
#left ul li a:visited {
   text-decoration: underline;
   line-height: 20px;
   font-size: 11px;
   color: #666;
}

#left ul li a:hover,
#left ul li a:active {
   color: #E13D0C;
}

/* primary menu - at the top of this site */


#menu ul,
#menu li {
   list-style-type:none;
 list-style-image:none;
   padding: 0;
   margin: 0;
}

#menu ul li {
   float: left;
   line-height: 30px;
}

#menu a,
#menu a:link,
#menu a:visited  {
   font-size: 12px;
   color: white;
   font-weight: bold;
   padding-right: 05px;
   text-transform: uppercase;
}

#menu ul li a:hover,
#menu ul li a#active_menu {
   text-decoration: blink;
   color: #ff0000;
}



img, fieldset {
   border: 0;
}

[elenix]

Nessuno sa darmi qualche input?
Mi sto rompendo la testa ma non ne vengo a capo! (scusate il gioco di parole

 

[tonicopi]

Cominciamo dalla cosa più semplice.
Per dettare una regola per il menù attivo devi fare così:
#menu a:active {
color:#666666;
}
per dargli colore diverso dagli altri menù per esempio

[elenix]

Fatto.
Ora diventa rosso solo se ci clicco sopra mentre in locale diventa rosso solo passandoci sopra...

Passiamo alla cosa più complicata?
Perchè in IE on line è tutto a sinistra mentre in IE localhos è posizionato ok?

[tonicopi]

Passiamo alla cosa più complicata?
Perchè in IE on line è tutto a sinistra mentre in IE localhos è posizionato ok?

Perchè per una corretta visualizzazione non conta solo il browser ma anche il server. Che in locale probabilmente sarà windows e in remoto linux 
Intanto abbiamo capito perchè. Adesso resta la cosa più difficile di tutte: impedirgli quello spostamento a destra 

[tonicopi]

Vediamo se la becco al primo colpo. Prova ad aggiungere il float right in questa regola css nel file template_css.css (riga 66)

Codice: [Seleziona]

#menu {
bottom:10px;
position:absolute;
right:190px;
float:right;
}

[elenix]

fatto... ma è ancora tutto a sinistra

[tonicopi]

Tira via quel float right che era una scempiaggine 
Mettici questo, sempre nella stessa regola:
width:220px;
Vediamo un pò...

[elenix]

ne ne ne

[tonicopi]

ne ne ne

Io lo vedo bene adesso con IE6 

[elenix]

Evviva, ora lo vedo anche io corretto!
Grazie GRANDE TONI!

[tonicopi]

Dobbiamo sempre fare grande attenzione ai giochi che ci tira la dannata cache dei browser, elenix. 
Talvolta facciamo delle modifiche che poi scartiamo perchè ci sembra che non abbiano prodotto nulla. Invece era la cache, questa guastafeste.