Ciao a tutti ragazzi, ho un problema con l'allineamento verticale di due immagini in due div diversi (uno flottato a sinistra e l'altro a destra). Ho visto che internet explorer non me le allinea allo stesso modo di firefox e oltretutto cambiando la risoluzione dello schermo si incasina con tutti i browser. Per allinearle uso i padding top, ma sembra che ie non abbia le stesse misure che usano gli altri browser. Se volete posso postare il codice, per far capire meglio.
Posto il codice:
HTML
<body>
<div id="cont">
<div id="header">
</div>
<div id="menuoriz">
<ul>
<li><a href="index.html"> Home </a></li>
<li><a href="ristorazione.html"> Ristorazione </a></li>
<li><a href="galleria.html"> Galleria </a></li>
<li><a href="informazioni.html"> Informazioni </a></li>
</ul>
</div>
<div id="layout">
<div id="map">
<iframe width="490" height="428" frameborder="0" scrolling="no" marginheight="0" marginwidth="0" src="http://www.openstreetmap.org/export/embed.html?bbox=11.632590293884276%2C45.3383233565 29536%2C11.640894412994383%2C45.34287824169021& ;layer=mapnik&marker=45.340600844914135%2C11.6 36742353439331" style="border: 1px solid black"></iframe><br/><small><a href="http://www.openstreetmap.org/?mlat=45.34060&mlon=11.63674#map=17/45.34060/11.63674&layers=N">Visualizza mappa ingrandita</a></small>
</div>
<div id="desc1">
<h2>Dove Siamo</h2>
<p> Siamo a circa 1 km dal centro di Vo' (PD): partendo dalla piazza proseguite dritti seguendo via IV Novembre
(SP89) in direzione Bastia. Alla rotonda continuate dritti imboccando via XXVIII Aprile (SP38), la seconda
uscita sulla sinistra in direzione Lovertino è via Mattiette. L'agriturismo è sulla sinistra, a circa 200 m
dall'incrocio. </p>
<div id="strada"></div>
</div>
<div id="info">
<h2>Info</h2>
<p> Agriturismo La Pioppa di Benato Antonio e Andrea <br/><br/>
Produzione e vendita vini tipici dei Colli Euganei <br/>
Degustazione prodotti tipici <br/>
Vendita salami e soppresse di produzione propria </p>
<div id="giorni">
<h2>Giorni di apertura</h2>
<p> Siamo aperti il: sabato, domenica e festivi <br/>
E' gradita la prenotazione per telefono </p>
</div>
<div id="contatti">
<h2>Indirizzo & Contatti</h2>
<p> Via Mattiette, 219 35030 Vo' (PD) <br />
Tel. e Fax - 049/9940261 <br />
Email - <a href="mailto:agrlapioppa@gmail.com">agrlapioppa@gm ail.com</a> <br />
C.F. e P.IVA 03310060284 </p>
</div>
</div>
<div id="spaccio">
<h2>Spaccio Vini "La Pioppa"</h2>
<p> Venite a trovarci anche al nostro punto vendita situato in: <br />
Viale della Pace, 33/A - 45100 Rovigo <br />
Tel. 345/3939178 <br /><br />
Vendita diretta di vino sfuso e in bottiglia <br />
Salami e soppresse di produzione propria </p><br />
<div id="orari">
<h3>Orari Punto Vendita</h3>
<p>Siamo aperti tutti i giorni dal Lunedì al Sabato <br />
Mattina: 8.30 - 12.30 Pomeriggio: 15.30 - 19.00 <br />
Lunedì mattina e Mercoledì chiusi</p>
</div>
</div>
<div id="footer1">
Azienda agrituristica "La Pioppa" di Benato Antonio e Andrea <br />
Via Mattiette 219, 35030 Vo' (PD) - Tel. e Fax 049/9940261 <br />
C.F. e P.IVA 03310060284
</div>
</div>
<div id="footer2">
Designed by <em> Eros Rossi </em>
</div>
</div>
</body>
CSS
*{
margin:0;
padding:0;
}
body{
font-family:"Times New Roman", Times, serif;
background-image:url(../images/bg.png);
background-repeat:repeat;
}
#cont{
margin:20px auto 20px auto;
width:950px;
}
#layout{
width:950px;
background-image:url(../images/layout.png);
background-repeat:repeat;
text-align:center;
}
#header{
background-image:url(../images/header.png);
width:950px;
height:200px;
position:relative;
}
#menuoriz{
margin-top:20px;
margin-bottom:20px;
width:950px;
height:100px;
background-image:url(../images/menu.png);
}
#menuoriz ul li{
font-family:Arial, Helvetica, sans-serif;
font-size:24px;
font-weight:bold;
list-style-type:none;
float:left;
padding-left:63px;
padding-right:63px;
padding-top:31px;
}
#menuoriz a:link{
display:block;
color:#FFF;
text-decoration:none;
}
#menuoriz a:visited{
color:#FFF;
text-decoration:none;
}
#menuoriz a:hover{
color:#900;
}
#map{
float:left;
width:490px;
padding-top:20px;
padding-left:20px;
}
#map a:visited{
color:blue;
}
#desc1{
float:right;
width:400px;
padding-right:20px;
}
#desc1 h2{
padding-top:15px;
}
#desc1 p{
font-size:18px;
text-align:justify;
padding-top:10px;
padding-bottom:15px;
}
#strada{
background-image:url(../images/strada.jpg);
width:400px;
height:235px;
}
#info{
clear:both;
float:left;
width:475px;
text-align:center;
}
#info h2{
padding-top:30px;
padding-bottom:10px;
}
#info p{
font-size:18px;
}
#giorni h2{
padding-top:20px;
}
#contatti h2{
padding-top:20px;
}
#spaccio{
float:right;
width:475px;
text-align:center;
}
#spaccio h2{
padding-top:30px;
padding-bottom:10px;
}
#spaccio p{
font-size:18px;
}
#orari h3{
padding-top:10px;
}
#footer1{
font-size:15px;
padding-bottom:10px;
padding-top:50px;
text-align:center;
clear:both;
}
#footer2{
font-size:13px;
text-align:right;
clear:right;
}
em{
color : #f00;
font-weight : bold;
text-decoration : none;
font-style:normal;
}
Praticamente quello che vorrei io è che l'immagine strada sia allineata con la mappa e l'ho fatto usando padding-top dal testo che ho sopra l'immagine di destra (strada.jpg). Solo che con internet explorer non è allineata (con gli altri browser si) e cambiando la risoluzione dello schermo (io vedo il sito a 1024*768) si sballa con tutti i browser. Avete qualche idea per sistemare questo discorso? Dov'è che sbaglio? Vi ringrazio in anticipo.
Nessuno mi aiuta?
Mi raccomando, non spingete eh! Certo che chiedere aiuto qui è come chiederlo al muro...
Ciao DarkMan, meglio evitare di postare codice con dati personali e email (il codice andrebbe fra l'altro postato fra gli appositi tag). Per verificare un problema è bene vedere direttamente il codice all'opera, puoi lasciare un link alla pagina?
Ciao, intanto grazie per avermi risposto. Sei il primo che lo fa, quindi ti ringrazio. Non sapevo bene come postare il messaggio, era il primo che mettevo. C'è un modo per modificare i post? Perchè non mi sembra si possa fare. I dati li ho lasciati per far capire meglio la struttura della pagina, comunque se si puo modificare li tolgo. Non posso mettere un link diretto al sito, in quanto è un sito che ho costruito e non ho ancora caricato su internet.
Dopo un certo tempo non si possono piu` modificare i post.
Per sapere come postare, e` bene leggere il regolamento: sono alcune regole di base, che dovrebbero essere di aiuto, ma se non vengono lette sono inutili.
IL tuo codice e` molto lungo ed e` difficile venirne a capo senza vedelo all'opera.
Inoltre non e` formattato, il che` rende la cosa piu` complessa.
Probabilmente non hai avuto risposte proprio per questi motivi.
Anche se non vuoi inserire la tua pagina nel tuo sito, puoi sempre pubblicare in un sito provvisorio (ci sono servizi gratuiti che lo permettono - anche su questo punto vedi il regolamento).
Nuova politica di maggiore severita` sui titoli delle discussioni: (ri)leggete il regolamento
No domande tecniche in messaggi privati
Devo ripostare il codice formattato? Comunque per servizi gratuiti per vedere la pagina intendi tipo altervista?
No, non c'è bisogno di ripostare il codice, non avremmo comunque le immagini. Il servizio che citi va bene, come andrebbe bene pure un servizio di file sharing su cui caricare la cartella zippata coi file della pagina (html, css e immagini)
Ok, ho creato un file zip con dentro i file html e css della pagina che non va tanto bene. Funziona solo quella, quindi non cliccate sugli altri link della pagina informazioni.html perchè non ho messo anche quelli. Ditemi come vedete l'allineamento delle due immagini e se sapete un metodo per aiutarmi a sistemarle. Grazie.
http://dumpshare.net/6249881Prova.zip
Ultima modifica di DarkMan20; 22-01-2014 a 19:58 Motivo: cambio termini
Permessi di invio
Rispondi quotando