Ragazzi ho un problema molto grave..
Sto cercando di farmi un template per wordpress...e sto ovviamente lavorando con css+php+html...
Allora vi spiego...devo creare un menu orizzontale con dei pulsanti (ogni pulsante ha la sua immagine), sotto i pulsanti vi è un immagine che dà continuità allìaspetto del blog, uno sfondo insomma...
Come al solito Firefox visualizza correttamente tutto correttamente ma ie mi da un problema...
è difficile da spiegare per i scritto vi posto delle immagini e una parte di codice per farvi capire:
Visualizzazione Firefox:
Visualizzazione IE
Tralasciando i margini superiori e inferiori del menu la visualizzazione di FF è decisamente indiscutibilmente migliore....
Ora vi posto un pezzo di codice:
In pratica funziona così associo ad ogni link due classi prima quella .btn_panda e poi animebtn in modo che venga visualizzato prima l'immagine del pulsante e sopra il link...
Però come vedete negli screen la pagina del blog è centrata (parte centrale bianca) e i pulsanti sono sono centrati alla pagina, ma fuoriescono dai bordi...
Ecco quindi la cosa strana:
Se aggiungo alla classe .menu una regola padding-left per "paddare" tutto il menu a sinistra e centralo manualmente, FF mi sposta solo i pulsanti per non sforare oltre la pagina che ha la stessa misura del background "blog_bg_r.jpg" mentre IE fregandosene che la misura della pagina è 1040px (appunto quanto l'immagine blog_bg_r.jpg) sposta TUTTO, pulsanti e background...
Come posso fare per ottenere in IE lo stesso risulatato di FF?
Ovvero spostare e centrare solo i pulsanti e non il background?
Grazie
Sto cercando di farmi un template per wordpress...e sto ovviamente lavorando con css+php+html...
Allora vi spiego...devo creare un menu orizzontale con dei pulsanti (ogni pulsante ha la sua immagine), sotto i pulsanti vi è un immagine che dà continuità allìaspetto del blog, uno sfondo insomma...
Come al solito Firefox visualizza correttamente tutto correttamente ma ie mi da un problema...
è difficile da spiegare per i scritto vi posto delle immagini e una parte di codice per farvi capire:
Visualizzazione Firefox:
Visualizzazione IE
Tralasciando i margini superiori e inferiori del menu la visualizzazione di FF è decisamente indiscutibilmente migliore....
Ora vi posto un pezzo di codice:
Codice:
.menu{ /*Container per il menu*/
float:left;
overflow: hidden;
width: auto;
background: url(images/blog_bg_r.jpg) repeat-y; /*menu background*/
.menu a.animebtn{ /*pulsanti eredita dalla classe .btn_* l'immagine del pulsante*/
display: block;
float: left;
font: bold italic 13px Georgia, "Times New Roman", Times, serif; /*dimensione del testo del link*/
line-height: 95px; /* definisce la posizione del link*/
height: 65px; /* altezza e larghezza del pulsante*/
width:160px;
text-decoration: none;
filter:progid:DXImageTransform.Microsoft.Alpha(opacity=70); /*controlla l'opacità prima che il pulsante ci passi sopra*/
opacity: 0.7;
}
/*IMMAGINI DEI PULSANTI*/
.btn_panda{
background: transparent url('images/pulsante_panda.png') no-repeat top left;
}
}In pratica funziona così associo ad ogni link due classi prima quella .btn_panda e poi animebtn in modo che venga visualizzato prima l'immagine del pulsante e sopra il link...
Però come vedete negli screen la pagina del blog è centrata (parte centrale bianca) e i pulsanti sono sono centrati alla pagina, ma fuoriescono dai bordi...
Ecco quindi la cosa strana:
Se aggiungo alla classe .menu una regola padding-left per "paddare" tutto il menu a sinistra e centralo manualmente, FF mi sposta solo i pulsanti per non sforare oltre la pagina che ha la stessa misura del background "blog_bg_r.jpg" mentre IE fregandosene che la misura della pagina è 1040px (appunto quanto l'immagine blog_bg_r.jpg) sposta TUTTO, pulsanti e background...
Come posso fare per ottenere in IE lo stesso risulatato di FF?
Ovvero spostare e centrare solo i pulsanti e non il background?
Grazie
