Pagina 1 di 2
Immagine della testata centrata con ogni risoluzione
Inviato: 28/08/2011, 17:57
da Ciccio74
Salve, è la prima volta che scrivo in questo forum per chiedere il vostro aiuto.
Sto impazzendo con i css da quando ho sostituito titolo e descrizione del forum con un'immagine (non il logo, per quello tutto ok).
Il mio problema è far sì che la suddetta immagine rimanga centrata nell'header con ogni risoluzione video ma, dopo innumerevoli tentativi, continua a non fungere.
Lo stile è Prosilver, la ver. 3.0.8, questa è la parte di codice in overall_header.html:
<div id="site-description">
<a href="http://www.terruncielli.it/" target=_blank title="Visita il nostro sito" id="logo">{SITE_LOGO_IMG}</a>
<h1><a href="http://[b]www.pianetafunghi.it[/b]/forum"><img src="http://www.pianetafunghi.it/forum/styles/prosilver/imageset/site_logo.png" alt="Logo Pianetafunghi" title="Home Pianetafunghi" [b]style="width: 596px; height: 111px; left: 50%; margin: -55px 0 0 298px;"[/b]></img></a></h1>
<p class="skiplink"><a href="#start_here">{L_SKIP}</a></p>
</div>
Qualcuno può darmi qualche suggerimento utile? Vi ringrazio a priori.
P.S:
Scusate, ho visto che avete giustamente spostato l'argomento... nessuno che possa aiutarmi please?
Re: Immagine della testata centrata con ogni risoluzione
Inviato: 28/08/2011, 23:18
da Angolo
Intanto, prova a inserire il codice citato, tra:
e
Se non viene centrato, togli questa parte:
Re: Immagine della testata centrata con ogni risoluzione
Inviato: 29/08/2011, 0:22
da Ciccio74
Innanzitutto grazie per la risposta...
Ci avevo già provato, così non cambia nulla
Codice: Seleziona tutto
<div align="center">
<a href="http://www.pianetafunghi.it/forum">
<img src="http://www.pianetafunghi.it/forum/styles/prosilver/imageset/site_logo.png" alt="Logo Pianetafunghi" title="Home Pianetafunghi" style="width: 596px; height: 111px; left: 50%; margin: -55px 0 0 298px;"></img>
</a>
</div>
Così invece l'immagine si sposta a sx e si abbassa posizionandosi sull'angolo destro basso del logo
Codice: Seleziona tutto
<div align="center">
<a href="http://www.pianetafunghi.it/forum">
<img src="http://www.pianetafunghi.it/forum/styles/prosilver/imageset/site_logo.png" alt="Logo Pianetafunghi" title="Home Pianetafunghi" style="width: 596px; height: 111px;"></img>
</a>
</div>
Al momento sul forum ho ripristinato il codice senza il div contenitore, quanto meno non sballa anche se non appare ben centrato con ogni risoluzione
... qualche altra idea?
P.S.:
Dimenticavo, se pensate che magari il problema sia altrove, magari nei css, ditemelo e vi posto il codice, grazie.
Re: Immagine della testata centrata con ogni risoluzione
Inviato: 29/08/2011, 9:24
da Angolo
Il riferimento css, lo hai escluso dal codice html. Quindi diventa irrilevante a questo punto.
A me però risulta centrato con una risoluzione di 1152x864.
Con quale risoluzione non ti risulterebbe centrato?
Posta uno screen di come lo vedi.
Re: Immagine della testata centrata con ogni risoluzione
Inviato: 29/08/2011, 12:28
da Ciccio74
Sorry per i messaggi ripetuti, nel caso specifico si tratta di risoluzione 1366x768, quella del mio portatile, l'immagine risulta un po' spostata verso sinistra, allego lo screen:
Re: Immagine della testata centrata con ogni risoluzione
Inviato: 29/08/2011, 12:57
da Angolo
La causa di questa lieve sfasatura, può essere causata dal fatto che il logo è a dimensione fissa. Ed il problema, pare si ponga solo sulle risoluzioni a 16:9, dove in quelle a 4:3 la questione è OK.
Prova a togliere completamente:
Se non risolvi, dai un valore percentuale, che devi trovare tu attraverso svariati tentativi:
Codice: Seleziona tutto
<div align="center">
<a href="http://www.pianetafunghi.it/forum">
<img src="http://www.pianetafunghi.it/forum/styles/prosilver/imageset/site_logo.png" alt="Logo Pianetafunghi" title="Home Pianetafunghi" style="width: 50%; height: 50%;"></img>
</a>
</div>
Io ho inserito 50%, per cominciare, ma devi trovare tu i valori percentuali ottimali, attraverso diversi tentativi.
L'istruzione del centrare, è stata data, e pare venga eseguita. Quindi è per vie secondarie che si può operare. Potresti aggiungere a style, l'istruzione: text-align: center;
Quindi:
Codice: Seleziona tutto
<div align="center">
<a href="http://www.pianetafunghi.it/forum">
<img src="http://www.pianetafunghi.it/forum/styles/prosilver/imageset/site_logo.png" alt="Logo Pianetafunghi" title="Home Pianetafunghi" style="width: 596px; height: 111px; text-align: center;"></img>
</a>
</div>
Oppure lo aggiungi al codice percentuale.
In breve, devi fare alcune prove.
Potresti anche modificare il valore percentuale del left nativo; ma rischieresti di trovarti con perfetto allineamento con la tua risoluzione... ma non perfetto nelle altre.
Come ultima spiaggia, potresti inserire uno script javascript che inserisca delle spaziature in base alla risoluzione.... ma è davvero necessario?
Valuta la possibilità di dargli tu deliberatamente, un allineamento a sinistra (left), che ha anche il suo senso.
P.S.
Si presume che le prove, tu le faccia in locale.
Re: Immagine della testata centrata con ogni risoluzione
Inviato: 29/08/2011, 13:27
da Micogian
Si potrebbe anche dividere in tre parti (in percentuale) la testata con i <div> e dare un margine "auto" all'immagine.
Codice: Seleziona tutto
img.centra_logo {
display: block;
margin-left: auto;
margin-right: auto;
}
che poi diventa
<img class="centra_logo" src="..." alt="...">[/code]
Re: Immagine della testata centrata con ogni risoluzione
Inviato: 29/08/2011, 14:32
da Barrnet
Non sarebbe più semplice impostare una dimensione fissa al forum? ^^
Re: Immagine della testata centrata con ogni risoluzione
Inviato: 29/08/2011, 14:59
da Micogian
Barrnet ha scritto:Non sarebbe più semplice impostare una dimensione fissa al forum? ^^
Condivido.
Nei miei Forum ho combattuto molto per questo e alla fine ho avuto ragione.
Ci sono utenti che preferiscono la pagina a tutto monitor ma io sostengo che specialmente quando nei posts ci sono immagini allegate, la dimensione della pagina deve essere bilanciata, quindi fissa, calcolando lo spazio per la tabella del Testo e dell'allegato e lo spazio da destinare al "profilo".
Con allegati di 800 pixel e spazio per il profilo io credo che una dimensione di 1024 pixel delal pagina sia corretta.
1024 è una risoluzione abbastanza diffusa, risoluzioni minori (800x600) credo siano ormai un ricordo.
Con risoluzioni superiori la pagina può sembrare piccola ma se il punto di riferimento è l'immagine allegata non vedo grossi problemi. Per il testo esiste la funzione di ingrandimento.
Re: Immagine della testata centrata con ogni risoluzione
Inviato: 29/08/2011, 16:38
da Blues
Provare a racchiuderlo in un box?
<table width="100%" border="0">
<td align="center">
</table></td></tr>