problema per centrare sito

asevenx

Utente Attivo
7 Nov 2009
312
0
16
Ciao a tutti, ho un problema per centrare la struttura di un sito. Riporto il link.
http://testsitifederico.altervista.org/sas/

La struttura della pagina è così definita:
HTML:
<div id="container">

        <div id="barframe">...</div>
	
        <div id="banner"><div class="banner-logo"></div></div>
        
        <div id="menu"><?php include("include/menu.php");?></div>
    	
        <div id="main"><?php include("include/main.php");?></div>

   	<div id="insights"><?php include("include/insights.php");?></div>
 
	<div id="footers"><?php include("include/footers.php");?></div>
			
	<div id="reservate">- <a class="mail" href="...">Area Riservata</a> -</div>
        
    </div>

Mentre il css è:
Codice:
body{
}

#container{
	margin:0 auto;
	max-width:1270px;	
}

#barframe{
	background-image:url(../images/a/menu-color.png);
	width:100%;
	max-width:1260px; /* -10 */
	font-size: normal 13px;
	font-family:"Open Sans";
	color: #e2e2e2;
	height: 35px;
	line-height: 35px;
	padding-left:10px;
	border-bottom:1px solid #575e64;
}

#banner {
	background-image:url(../images/a/banner-complete.png);
	background-repeat: no-repeat;
	height:149px;
	width:100%;
	max-width:1280px;
	display:block;
}

#main {
	background-image:url(../images/a/main-wall.png);
	height:300px;
	width:100%;
	max-width:1280px;
	display:block;
}

#mini {
	background-image:url(../images/a/main-miniwall.png);
	height:189px;
	width:100%;
	max-width:1280px;
	display:block;
}

#insights{
	background-image:url(../images/a/insights-color.png);
	width:100%;
	max-width:1280px;	
	border-top:2px solid #474747;	
}

#footers{
	background-image:url(../images/a/footers-color.png);
	width:100%;
	max-width:1280px;
	height:100%;
	font-family:"Open Sans";
	color:#e2e2e2;
	padding:18px 0px 13px 0px;
	text-align:center;
	border-top:2px solid #474747;
}

#reservate{
	background-image:url(../images/a/insights-color.png);
	width:100%;	
	max-width:1280px;
	height:100%;	
	min-height:50px;	
	font-family:"Open Sans";
	color:#e2e2e2;
	padding:10px 0px 0px 0px;
	text-align:center;
}

/* pagine */

#page{
	background-image:url(../images/a/page-color.png);
	background-repeat:repeat-x;
	background-color:#e2e2e2;
	font-family:"Open Sans";
	color:#474747;	
	width:100%;
	max-width:1280px;
	padding:20px 0 20px 0;
	text-align:left;		
}

Dove può essere il problema? grazie a tutti
 

Max 1

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
29 Feb 2012
4.388
338
83
A colpo d'occhio mi sembra che il problema lo dia la regola max-width, inquanto se la finestra è meno di 1280px, si centra mentre se la finestra è più grande resta a sinistra perchè manca la regola margin:0 auto;.

Poi il meno è troppo largo non tutti usano una finestra a tutto schermo come il sottoscritto, pertanto il menu risulta troppo largo
 

Max 1

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
29 Feb 2012
4.388
338
83
Per quello che ho visto l'unico problema è nel footer non centrato ti basta aggiungere in #footers e #reservate la digitura margin: auto;
E io cosa ho detto? :mavieni::mavieni::mavieni:

Anche la regola max-width è inutile e crea problemi:mavieni:
 

Noè Murr

Nuovo Utente
11 Apr 2015
9
0
1
ciao, guarda a mio avviso hanno ragione Max1 e StratoKyle, ma se proprio vuoi tenere la regola max-width ti consiglio di impostarla uguale su tutti i vari div, per esempio la barra di navigazione in alto c'è l'hai a 1270 px mentre tutto il resto a 1280.. inoltre dovresti come hanno gia detto aggiungere la regola dei margini, io l'ho controllata solo in firefox perchè li ho gli strumenti per modificare il CSS senza dover scaricare praticamente tutte le pagine del sito, ed inserendo la stessa larghezza a tutti i vari componenti e la regola Margin:auto mi sembra che sia perfetto.

P.S. come saprai il sito funziona solo per computer, sui telefoni o su finestre di dimensioni ridotte non funziona molto bene.

Schermata 2015-04-12 alle 10.54.22.jpgSchermata 2015-04-12 alle 10.54.20.jpgSchermata 2015-04-12 alle 10.52.48.jpg
 

WottaFacca

Utente Attivo
20 Mar 2015
134
0
0
Desenzano d/G
1) Ti consiglio di togliere quella parte bianca che separa il corpo del sito dal bordo della finestra, ovviamente parlo per gusto personale, è orribile, spero non te la prenda con me

2) Dovresti "stringere" il logo, in modo da evitare lo scroll orizzontale della pagina

3) Prova a lavorare con le grandezze in percentuale, ti aiuta molto ad impostare "bene" il sito

Spero di esserti stato d'aiuto ;)
 
Discussioni simili
Autore Titolo Forum Risposte Data
L Problema per centrare titolo PopUp HTML e CSS 5
F INDESIGN: problema esportazione esecutivo per la stampa con foto B/N Webdesign e Grafica 0
M Problema con php per calcolo costo percentuale PHP 7
P [HTML] Problema con menu orizzontale a tendina per sito web HTML e CSS 17
L [javascript]problema funzione per webapi Javascript 4
S Problema in PHP per invio file XML - RISOLTO- PHP 8
Delemir78 [PHP] Problema per ridurre delle immagini e spostare i files in cartelle PHP 5
M Problema con ciclo foreach per chiusura apertura div in base al numero di record in database PHP 1
E problema per aggiungere un database mdf da visual studio .NET Framework 9
E problema per Sito per eventi e sagre Leggi, Normative e Fisco 0
P Problema domande duplicate per risposte multiple PHP 6
M Problema chiamata Ajax per vista Griglia o vista Lista Ajax 1
M Problema connessione su OS X YOSEMITE 10.10 per il server locale mysql MySQL 0
M Problema connessione su OS X YOSEMITE 10.10 per il server locale mysql Mac e Software 0
C usare un foglio php per la creazione di un excel: piccolo problema PHP 2
B Problema form mail per invio doppio allegato PHP 1
Laura99 Problema per cambiare immagine PHP 7
T Problema di risoluzione dello sfondo per un sito web Photoshop 1
A Problema orario invio mail per form PHP 4
Akuma consiglio sicurezza per soluzione problema apici PHP 0
P Problema per richiamare una variabile... PHP 3
L [c++] Problema leggere file txt riga per riga C/C++ 0
J Problema per creare anteprima dei post da un db PHP 2
J Problema classe per preview post PHP 2
L problema con l'Undefined index per una $_GET PHP 6
E Problema import per aggiornamento PHP 0
F Problema divisione smiles aggiuntivi per pagine Javascript 1
L problema variabile per creare sessione PHP 5
helpdesk problema interfaccia per ogni utente PHP 0
M problema con ciclo foreach per estrarre dati da un database PHP 22
M problema phplist per confermare l'email e l'inscrizione Content Management System (CMS) 0
P problema con il countdown per la fine dell'anno e per natale Javascript 13
M Problema con form per accesso area riservata ai soci PHP 2
D Problema con il disclaimer/pagina per l'accesso al'sito, funziona solo con firefox PHP 0
D problema script per visualizzare report tradedoubler PHP 1
C Problema con il CSS per il comando text-align HTML e CSS 10
D Problema con funzione preg_match() per controllo email PHP 2
C Problema per impostazione dei caratteri su un blog. Javascript 20
EffeElle Problema per una query di aggiornamento record php PHP 35
M problema xampp per ubuntu Linux e Software 1
A problema con un semplice form per un loggin in php PHP 2
StarFish Lettore RSS per Windows Phone 7, problema charset [Era: caratteri strani in RSS] Sviluppo app per Windows Phone 1
catellostefano Problema per richiamare file xml -- Warning: DOMDocument::load() [domdocument.load]: PHP 0
L problema con get per includere pagine dal database PHP 4
asevenx problema con funzione per far apparire e scomparire un form di commenti PHP 1
max_400 Problema apostrofo nella ricezione della variabile per poi scriverla dentro un file PHP 6
V problema per collegare tabelle MySQL 2
L Problema e consiglio per form contatti particolare Classic ASP 2
H Piccola applicazione per News con Php, Xml e Flash: problema ordinamento. XML 0
C Problema Indice alfanumerico per un array Database 4

Discussioni simili