Problema menù

ciccio9999

Utente Attivo
16 Ago 2011
30
0
0
Non sono molto pratico con CSS ma ho provato a fare una home page. Ho due problemi con il menù...
1) Non so come fare a fare in modo che sia con Google Chrome che con Firefox si vedano correttamente... Fatto in un modo con GC sfora ma con MF si vede ben accentrato... Fatto in un altro sfora con Firefox ma va bene con GC...
Cosa sbaglio?

PHP:
body {
	background-image: url("Sfondo.png");
	} 
#container {
		width: 900px;
		height: 840px;
		margin: auto;
		}
#header {
		width: 900px;
		height: 250px;
		background-image: url("Header.png");
		
	}
#centro {
		width: 900px;
		height: 620px;
		background-image: url(corpo.png);
		
	}
#menu {
		width: 900px;
		height: 50px;
		position: absolute;
		margin-left: 35%;
		left: -225;
	}
#menu ul {
		list-style: none;
		margin: 10px;
		padding: 0;
		}
#menu ul li {
		display: inline;
		}
#menu ul a {
		text-decoration: none;
		display: block;
		float: left;
		line-height: 25px;
		color: white;
		margin-right: 50px;
		}
#menu ul a:hover {
			color:#b214b8;
			}
#contenuti {
		width: 850;
		height: 500;
		margin: auto;
		padding: 20px;
		position: relative;
		top: 50px;
		overflow: auto;
		}
#footer {
		width: 900px;
		height: 30px;
		background-image: url("Footer.png");
	}
#footer a {
		text-decoration: none;
		color: white;
		font-size: 11px;
		font-weight: bold;
		}

Questa è la pagina html:

PHP:
<html>
<head>
<style>
@import url(home.css);
</style>
</head>
<body>
<div id="container">
<div id="header"></div>
<div id="centro">
<div id="menu">
	<ul>
		<li><a href="home.php"><b>Home</b></a></li>		
		<li><a href=""><b>Tesserati</b></a></li>
		<li><a href=""><b>Nazionali</b></a></li>
		<li><a href=""><b>Partite</b></a></li>		
		<li><a href=""><b>Albo d'oro</b></a></li>
		<li><a href=""><b>Marcatori</b></a></li>
		<li><a href=""><b>Notizie</b></a></li>
	</ul>
</div>
<div id="contenuti">
</div>
</div>
<div id="footer">
</div>
</div>
</body>
</html>

2) Come faccio a fare in modo che il menù è accentrato?
 

ciccio9999

Utente Attivo
16 Ago 2011
30
0
0
Ho modificato i css e ho cambiato questo blocco:

PHP:
#menu {
		width: 900px;
		height: 50px;
		position: absolute;
		margin: 0 auto;
	}

La situazione ora è migliorata ed è più "coerente" per i due browser... Ci sono però gli stessi problemi:

1) Non è centrato ma è tutto spostato sulla sinistra dell'area di menù... Come faccio a centrarlo?
2) Tra MF e GC ci sono delle differenze di dimenzioni: in MF è tutto più grande e lo spazio a destra è molto sottile... Su GC c'è molto spazio a destra... Come si fa?
 

ciccio9999

Utente Attivo
16 Ago 2011
30
0
0
Non mi si centra comunque... E comunque non so come fare per fare in modo che si veda uguale sia con MF che con GC e altri browser
 

ciccio9999

Utente Attivo
16 Ago 2011
30
0
0
Ho aggiunto questa cosa:

PHP:
#menu ul li {
		display: inline;
		width: 14%;
		float: left;
		text-align: center;
		font-weight: bold;
		}

E pare che per tutti i browser si veda allo stesso modo... Il problema è che mi si vede così:

Screenshot-1.png

Come faccio a fare in modo che la distanza tra i campi sia la stessa? Oppure andrebbe bene anche una cosa così:

Screenshot-2.png
 

borgo italia

Super Moderatore
Membro dello Staff
SUPER MOD
MOD
4 Feb 2008
16.046
150
63
PR
www.borgo-italia.it
ciao
prova in questo modo, ho provato solo la parte relativa al menù
HTML:
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
<title>Documento senza titolo</title>
<style type="text/css">
#menu { 
        width: 900px; 
        height: 50px; 
        position: absolute; 
        background-color:#FF0000; /*messo per evidenziare*/
    } 
#menu ul { 
        list-style: none; 
        display:block;
        } 
#menu li { 
        display: inline;
        text-align:center;
        } 
#menu  a { 
        text-decoration: none;
        display: block;
        width:90px;/*da provare in modo che il testo sia interno*/
        float: left; 
        line-height: 25px; 
        color: white;
        margin-right: 1.5%;/*da provare in funzione del width*/
        margin-left: 1.5%;/*uguale al right*/
        font-weight:bold;/*così non servono i tag <b>*/
        background-color:#CCCC99;/*messo colore di back per evidenziare meglio dove posizionato testo*/
        } 
#menu  a:hover { 
            color:#b214b8; 
            } 

</style>
</head>
<body>
<div id="menu"> 
    <ul> 
        <li><a href="home.php">Home</a></li>         
        <li><a href="">Tesserati</a></li> 
        <li><a href="">Nazionali</a></li> 
        <li><a href="">Partite</a></li>         
        <li><a href="">Albo d'oro</a></li> 
        <li><a href="">Marcatori</a></li> 
        <li><a href="">Notizie</a></li> 
    </ul> 
</div> 
</body>
</html>
 
Discussioni simili
Autore Titolo Forum Risposte Data
F Problema hover voce di menù Javascript 2
P problema con tendina del menù, scompare sotto i contenuti HTML e CSS 7
LuigiDonato Problema Visualizzazione Menù HTML e CSS 17
andreaco Problema menù a scomparsa laterale HTML e CSS 10
Antares82 Problema menù a tendine PHP 6
B Problema con menù a tendina HTML e CSS 4
I Problema Menù a cascata complesso HTML e CSS 4
S problema menù espandibile Javascript 1
L problema con menù css HTML e CSS 1
E problema link nel menù XML 0
SilentMohai Problema di visualizzazione menù Javascript con InternetExplorer Javascript 0
P Problema con un menù a tendina PHP 7
M problema menù orizzonatale JS internet explorer Javascript 41
M [HTML/JAVASCRIPT] Problema Blocco Menù HTML e CSS 0
F Piccolo Problema menù espandibile toogle Javascript 6
G problema con menù e pulsanti flash Flash 0
P Problema: menù a tendina Javascript 1
I Sto progettando nuovi siti utilizzando bootstrap e devo dire funziona bene, l'unico problema e la maschera -moz- HTML e CSS 0
K Problema form update PHP 2
O problema con dvr dahua xvr5116 IP Cam e Videosorveglianza 0
S Problema nel ciclare un json Javascript 0
G Problema con Xampp Web Server 1
andrea barletta Problema con miniature comandi Photoshop 0
I problema con alice Posta Elettronica 0
K Problema Inner join PHP 1
F firefox problema http Linux e Software 0
N Problema con position absolute e overflow HTML e CSS 4
E Problema jquery Success jQuery 2
L Problema con inner join PHP 11
K [php] Problema con inner join PHP 4
E problema selezione sfumata Photoshop 2
K [PHP] Problema con variabili concatenate. PHP 1
A Problema filtro fluidifica Photoshop Photoshop 1
H Problema Bordi Scontorno Photoshop 1
O problema con query PHP 4
R Problema installazione Realtek WiFi USB rtl8821 Reti LAN e Wireless 1
I problema con 2 account Posta Elettronica 1
L problema collegamento file css con html HTML e CSS 1
Y Problema percorso file in rete PHP 1
N Problema SEO "L'URL non si trova su Google" SEO e Posizionamento 4
E Problema accesso a file con app sviluppata con MIT APP INVENTOR 2 Sviluppo app per Android 0
P Problema acquisizione clienti Webdesign e Grafica 1
F NetBeans problema creazione progetto Java Windows e Software 0
M Problema con Try Catch PHP 0
C problema seo + cerco esperto SEO e Posizionamento 11
Sergio Unia Problema con gli eventi del mouse su una data table: Javascript 2
T PROBLEMA CON SESSIONI PHP 3
A Problema, non so, di scale() o transform, oppure altro? HTML e CSS 0
T ALTRO PROBLEMA CON ARRAY PHP PHP 1
R problema con else PHP 0

Discussioni simili