visualizzazione diversa IE/Firefox

Se stai imparando a costruirti il tuo template qui trovi consigli e risposte ai tuoi dubbi sull'HTML

Moderatori: Moderatori iobloggo, Moderatori HTML & Grafica

visualizzazione diversa IE/Firefox

Messaggioda boyracer » 11 aprile 2006, 16:32

ciao a tutti, ho appena cambiato la mia skin e mi accorgo che con Firefox si vede perfettamente ( http://img50.imageshack.us/img50/8547/immagine3ba.jpg ), mentre con IE si nota un enorme spazio bianco tra l'header e il post ( http://img99.imageshack.us/img99/1088/dc33qg.jpg )...da cosa dipende?

il blog è http://boyracer.iobloggo.com
boyracer
principiante
principiante
 
Messaggi: 1
Iscritto il: 11 aprile 2006, 14:58

problema simile

Messaggioda griz » 30 aprile 2006, 16:17

Ho creato il template du firefox, e con quest'ultimo e safari viene visualizzato correttamente, ma su IE invece il mio blog non è visualizzabile.

Non conosco benissimo l'HTML e non riesco a capire cosa dveo modificare
griz
inesperto
inesperto
 
Messaggi: 5
Iscritto il: 30 aprile 2006, 16:12

Messaggioda Alexiel » 30 aprile 2006, 19:50

:ko:
guarda io è una vita che litigo con IE per questo motivo: il mio blog nn è mai perfetto visualizzato lì >__< passiamo tutti a FF! :D
Cercare prima di postare
Prima di postare una richiesta d'aiuto, usate la ricerca! Qualcuno prima di voi potrebbe aver già avuto lo stesso problema!
(cit. regolamento: http://forum.iobloggo.com/viewtopic.php?f=1&t=4)

Immagine Immagine
Avatar utente
Alexiel
Moderatore
Moderatore
 
Messaggi: 1777
Iscritto il: 3 agosto 2004, 16:32
Località: Napoli
Indirizzo blog: http://alexiel.iobloggo.com/

Messaggioda griz » 30 aprile 2006, 20:10

Eh sarebbero troppe le persone da convincere...

fosse solo qualche cosa che non è visualizzato bene non mi preoccuperei, peccato che per internet explorer il mio blog proprio non esiste: è una pagina vuota!
griz
inesperto
inesperto
 
Messaggi: 5
Iscritto il: 30 aprile 2006, 16:12

Re: visualizzazione diversa IE/Firefox

Messaggioda SimplyRobi » 1 maggio 2006, 14:42

boyracer ha scritto:ciao a tutti, ho appena cambiato la mia skin e mi accorgo che con Firefox si vede perfettamente, mentre con IE si nota un enorme spazio bianco tra l'header e il post


Per la verità io lo vedo identico con entrambi i browser...
SimplyRobi
maniaco
maniaco
 
Messaggi: 522
Iscritto il: 11 novembre 2005, 2:39
Località: Gorizia

Messaggioda *Alisea* » 3 maggio 2006, 16:50

Vedo ora questo topic... ho esposto anch'io lo stesso problema proprio qui: http://forum.iobloggo.com/viewtopic.php?p=38902#38902
:(
Immagine Immagine Immagine
Avatar utente
*Alisea*
dipendente
dipendente
 
Messaggi: 849
Iscritto il: 26 giugno 2004, 11:45
Località: Milano

Messaggioda RiaPatty » 7 maggio 2006, 16:08

ho lo stesso problema anche io. Però su IE lo vedo perfetto, invece è su Firefox che è tutto sballato! Non c'è una soluzione?
RiaPatty
purosangue
purosangue
 
Messaggi: 277
Iscritto il: 19 settembre 2005, 18:08
Indirizzo blog: perledivetro.iobloggo.com

Messaggioda Vero89 » 11 agosto 2006, 16:42

RiaPatty ha scritto:ho lo stesso problema anche io. Però su IE lo vedo perfetto, invece è su Firefox che è tutto sballato! Non c'è una soluzione?


Ecco idem.
Su IE si vede perfettamente (almeno a me XD) ma su Firefox ci sono diversi errori.

Ecco come dovrebbe essere (e come lo vedo io):

http://img104.imageshack.us/img104/2412 ... hottw9.png

E come appare ad un amico che usa FireFox:
http://img.photobucket.com/albums/v285/ ... blogFF.jpg

Ho già provato a vedere l'url con il validator, ma non mi da' errori nella parte di codice fatta da me :?

E questo è il codice della pagina (almeno per quanto riguarda la parte "importante"):
Codice: Seleziona tutto
<!--//
// VERONICA - LET ME BE (C) Veronica 2004-2006
//-->

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<html>
<head>
<meta http-equiv="Content-Language" content="it">
<meta http-equiv="title" content="Veronica - Let Me Be">
<meta name="description" content="Veronica's personal blog">
<meta name="revisit-after" content="1">
<meta http-equiv="imagetoolbar" content="no">

<script language="JavaScript" type="text/javascript">
<!-- Start
<!--  prelevato su http://www.web-link.it -->
var bookmarkurl="http://vero89.iobloggo.com/"
var bookmarktitle="Veronica - Let Me Be"
function addbookmark(){
if (document.all)
window.external.AddFavorite(bookmarkurl,bookmarktitle)
}
//  End -->
</script>

<script language="JavaScript">
defaultStatus = "Veronica."
</script>

<title>Veronica; Let me be</title>

<STYLE type=text/css>
body {background-color: #CDD9D9; cursor: crosshair; padding: 0px; font-family: Verdana; font-size: 9px; font-weight: normal; color: #696969; text-align: left; scrollbar-face-color : #E2E9E9; scrollbar-shadow-color : #86A2A2; scrollbar-highlight-color : #86A2A2; scrollbar-3dlight-color : #CDD9D9; scrollbar-darkshadow-color : #CDD9D9; scrollbar-track-color : #CDD9D9; scrollbar-arrow-color : #86A2A2;} 

a:link, a:active, a:visited {color: #FDA8CE; text-decoration: none; cursor: default; font-weight: bold;}

a:hover {color: #F9BCA2; text-decoration: none; cursor: default; font-weight: bold;}

i,em {font-family: Trebuchet MS; font-size: 9px; color: #FA9E16;}

b,strong {font-family: Garamond; font-size: 12px; color: #1AB7C8;}

input {border: 1px solid #86A2A2; font: 9px Verdana; color: #696969; background-color:#E2E9E9}

#corpopagina {font-family: Verdana; font-size: 9px; width: 578px; margin: auto;}

#corpo {font-family: Verdana; font-size: 9px; width: 578px; margin: auto; text-align: left; padding: 2px;}

#header {width: 578px; height: 464px; padding: 2px; background-image: url('http://img.photobucket.com/albums/v285/Vero89/bLog/main.jpg');}

#base {width: 578px; line-height: 10px; repeat: repeat-y; padding: 0px; background-image: url('http://img.photobucket.com/albums/v285/Vero89/bLog/bg.jpg'); float: left; z-index: 10; margin-top: -2px; margin-left: -1px;}

#blog {position: relative; width: 374px; left: 10px; top: -27px; padding: 3px; text-align: justify;}

#navigation {position: absolute; line-height: 10px; width: 176px; left: 397px; top: 97px; padding: 3px; text-align: justify;}

.title {font-family: Tahoma; font-size: 10px; color: #F5956B; width: 370px; text-align: left; font-weight: bold; text-transform: lowercase; border-bottom: 1px solid #FFFFFF; line-height: 11px;}

.menu {font-family: Tahoma; font-size: 10px; color: #F5956B; width: 172px; text-align: right; font-weight: bold; text-transform: lowercase; border-bottom: 1px solid #FFFFFF; line-height: 11px;}

.tag_counter {display: none;}

.various {font-family: Tahoma; font-size: 10px; color: #86A2A2; font-weight: bold; padding-left: 2px; padding-right: 2px; letter-spacing: 1px;}

.countdown{font-family: Verdana; font-size: 9px; color: #696969; font-weight: bold;}

.calBorder {font-family: Verdana; font-size: 9px; font-weight: bold; color: #000000; border: 0px;}

.calHeader {border: 1px solid #86A2A2; background-color: #E2E9E9; color: #000000; font-weight: bold; font-family: Verdana; font-size: 9px; text-align: center;}

.calDay {font-family: Verdana;font-size: 9px; letter-spacing: 0px; border: 1px solid #86A2A2; background-color: #FFFFFF; color: #696969; text-align: center;}

.calToday {border: 2px solid #86A2A2; background-color: #E2E9E9; font-weight: bold; color: #000000;}

.calDay A {font-weight: bold; text-decoration: none;}

.calToday A {font-weight: bold;text-decoration: underline;}

.tag_enorme {font-family: Century Gothic; font-size: 24px; font-weight: bold;}

.tag_grande {font-family: Century Gothic; font-size: 18px; font-weight: bold;

.tag_medio {font-family: Century Gothic; font-size: 14px; font-weight: bold;

.tag_piccolo {font-family: Century Gothic; font-size: 12px; font-weight: bold;}

.tag_moltopiccolo {font-family: Century Gothic; font-size: 10px; font-weight: bold;}
</style>
</head>
<body>
<div id="corpopagina">
<div id="header"></div>
<div id="corpo">
<div id="base">
<div id="blog"><!--// INIZIO POST //-->--post--<!--// FINE POST //--></div>
<div id="navigation">
<!--// INIZIO NAVIGATION //-->
[...]
<!--// FINE NAVIGATION //-->
</div>
</div>
</div>
</div>
</body>
</html>


dov'è che sbaglio? Quando uso le tabelle non ho problemi, con i div è uno sfascio -_-
Vero89
esperto
esperto
 
Messaggi: 135
Iscritto il: 5 febbraio 2005, 15:11
Località: Mantova

Messaggioda cm » 11 agosto 2006, 17:20

Ho dato un'occhiata al volo usando l'editor Quanta e probabilmente non è un grosso errore, ma...

.tag_grande {font-family: Century Gothic; font-size: 18px; font-weight: bold;

.tag_medio {font-family: Century Gothic; font-size: 14px; font-weight: bold;


... è un errore di copia-incolla o a questo stile manca la graffa per chiuderlo?
Immagine

"God's in his heaven, all's right with the world"
cm
purosangue
purosangue
 
Messaggi: 477
Iscritto il: 17 luglio 2006, 22:41
Località: Brianza, IT
Indirizzo blog: http://cm.iobloggo.com

Messaggioda Vero89 » 11 agosto 2006, 17:29

Grazie, mi era proprio sfuggito :oops:
però deve esserci un errore nell'impaginazione, secondo me è nei valori top, left ecc. negli ID. Solo che non capisco come.
Vero89
esperto
esperto
 
Messaggi: 135
Iscritto il: 5 febbraio 2005, 15:11
Località: Mantova

Messaggioda cm » 11 agosto 2006, 17:37

Ti va bene che in questo momento sto smanettando anche io con un editor HTML e mi ci vuole un attimo a fare delle prove :)


#navigation {position: absolute; line-height: 10px; width: 176px; left: 397px; top: 97px; padding: 3px; text-align: justify;}


Cio ho lavorato due secondi, quello che left:ho visto è che il problema sta nel left: 397px; e nel fatto che usi position: absolute.

L'effetto è che quando cambi la dimensione del browser, cambia tutto perchè quello che è "relative" si sposta di conseguenza, invece ciò che è absolute rimane fisso!

Prova invece in questo modo (in grassetto le mie modifiche):

#navigation {position: relative; line-height: 10px; width: 176px; left: 397px; top: -440px; padding: 3px; text-align: justify;}
Immagine

"God's in his heaven, all's right with the world"
cm
purosangue
purosangue
 
Messaggi: 477
Iscritto il: 17 luglio 2006, 22:41
Località: Brianza, IT
Indirizzo blog: http://cm.iobloggo.com

Messaggioda Vero89 » 11 agosto 2006, 18:03

Infatti inizialmente l'avevo impostato relative, poi come son finita nell'absolute lo so solo io :?

Comunque anche così mi dà dei problemi.

Nell'anteprima di iobloggo:
http://img.photobucket.com/albums/v285/ ... creen4.png

Nel mio IE:
http://img.photobucket.com/albums/v285/ ... creen1.png
http://img.photobucket.com/albums/v285/ ... creen2.png
http://img.photobucket.com/albums/v285/ ... creen3.png

ma perchè? :ko: :cry:
Vero89
esperto
esperto
 
Messaggi: 135
Iscritto il: 5 febbraio 2005, 15:11
Località: Mantova

Messaggioda cm » 11 agosto 2006, 18:19

[quote="Vero89]ma perchè? :ko: :cry:[/quote]

mi spiace doverti rispondere "è solo perchè usi IE"... non è una presa in giro e mi spiego.

IE sta dimostrando la sua anzianità di servizio. Concettualmente è la stessa versione che gira in giro da almeno sei anni e in MS non hanno mai fatto grossi sforzi per renderla compatibile con le recenti tendenze.
I fogli di stile mal gestiti sono la punta dell'iceberg di una serie di problemi che sulla versione attuale non si sono voluti mai risolvere, infatti si sta puntando alla versione 7 che viene garantita più figa, più sicura, più facile da usare, ecc... purtroppo la versione 7 è ancora in Beta ed io mi guardo bene dall'installare una versione beta di qualsiasi programma che lavora in internet e che rischia di aprire una marea di falle.

Se poi ti interessa vedere come i browser rispondono alle formattazioni dei fogli di stile, vai a questo link http://www.webstandards.org/action/acid2/ ed esegui il test Acid2... vedrai che neppure Firefox n ne esce indenne.
Immagine

"God's in his heaven, all's right with the world"
cm
purosangue
purosangue
 
Messaggi: 477
Iscritto il: 17 luglio 2006, 22:41
Località: Brianza, IT
Indirizzo blog: http://cm.iobloggo.com

Messaggioda Vero89 » 11 agosto 2006, 18:21

Quindi non è possibile rendere UNA colonna compatibile sia a IE che a FF? :cry:

Se tu hai FireFox, mi diresti come vedi il blog? (l'ho reso pubblico per un attimo)
http://vero89.iobloggo.com
Vero89
esperto
esperto
 
Messaggi: 135
Iscritto il: 5 febbraio 2005, 15:11
Località: Mantova

Messaggioda cm » 11 agosto 2006, 19:06

Si vede male.

le scritte sono incolonnate bene in verticale, ma in orizzontale sono sistemate male
Immagine

"God's in his heaven, all's right with the world"
cm
purosangue
purosangue
 
Messaggi: 477
Iscritto il: 17 luglio 2006, 22:41
Località: Brianza, IT
Indirizzo blog: http://cm.iobloggo.com

Prossimo

Torna a HTML, CSS e Javascript

Chi c’è in linea

Visitano il forum: Nessuno e 1 ospite

cron