Utility
Home Messaggi odierni FAQ Ricerca avanzata Lo staff del forum Regolamento Utenti Archivio
Visualizzazione dei risultati da 1 a 3 su 3
  1. 20-05-2015, 21:49 #1
    Chloe Chloe
    Chloe Chloe non è in linea
    Utente di HTML.it
    Registrato dal
    May 2015
    Messaggi
    3

    centrare un menù css orizzontale!!! aiuto!

    buonasera a tutti! mi sono appena iscritta a questo forum perché vorrei una mano per centrare un menu di un sito web che sto elaborando per la scuola....
    ho creato voci, modificato gli stili ma l'unica cosa che mi sta facendo impazzire è centrarlo!
    aiutatemi a capire cosa ho sbagliato vi prego!
    vi lascio il testo del mio menu in css/html completo...

    <div id='menuhome'>
    <ul id='menu'>
    <li><a href="#">Home</a></li>
    <li><a href="#">Chi siamo</a></li>
    <li><a href="#">I nostri prodotti</a>
    <ul>
    <li><a href="#">Medicina naturale</a></li>
    <li><a href="#">Cosmetici</a></li>
    <li><a href="#">Tisane e Infusi</a></li>
    </ul>
    <li><a href="#">Compra online</a></li>
    <li><a href="#">Contatti</a></li>
    </ul>
    </div>
    </DIV>


    <style type="text/css">
    #menuhome {
    background:
    width: 100%;
    color: #FFF;
    margin: 0 auto;
    padding: 0;
    text-align: left;
    position: relative;
    border-top:0px solid #FFF;
    height:40 px;
    }
    #menu {
    margin: 0;
    padding: 0;
    }
    #menu ul {
    float: right;
    list-style: none;
    margin: 0;
    padding: 0;
    }
    #menu li {
    list-style: none;
    margin: 0;
    padding: 0;
    }
    #menu li a, #menu li a:link, #menu li a:visited {
    color: #C71585;
    display: block;
    font: normal 20px Lucida Calligraphy; margin: 0;
    padding: 8px 12px 8px 12px;
    text-align: center;
    text-decoration: none;
    height:25px;
    }
    #menu li a:hover, #menu li a:active {
    background: #90EE90;
    color: #C71585;
    display: block;
    text-decoration: none;
    margin: 0;
    padding: 8px 12px 8px 12px;
    }
    #menu li {
    float: left;
    padding: 0;
    }
    #menu li ul {
    z-index: 4444;
    position: absolute;
    left: -444em;
    height: auto;
    width: 140px;
    margin: 0;
    padding: 0;
    }
    #menu li ul a {
    width: 140px;
    }
    #menu li ul ul {
    margin: -60px 0 0 100px;
    }
    #menu li:hover ul ul, #menu li:hover ul ul ul, #menu li.sfhover ul ul, #menu li.sfhover ul ul ul {
    left: -999em;
    }
    #menu li:hover ul, #menu li li:hover ul, #menu li li li:hover ul, #menu li.sfhover ul, #menu li li.sfhover ul {
    left: auto;
    }
    #menu li:hover ul, #menu li li:hover ul, #menu li li li:hover ul, #menu li.sfhover ul, #menu li li.sfhover ul {
    left: auto;
    }
    #menu li li a, #menu li li a:link, #menu li li a:visited {
    background: "#90EE90";
    width: 168px;
    color: #C71585;
    display: block;
    font: normal 14px Lucida Calligraphy, sans-serif;
    margin: 0;
    padding: 9px 14px 10px 14px;
    text-decoration: none;
    z-index:9999;
    border-bottom:0px dotted #FFF;
    }
    #menu li li a:hover, #menu li li a:active {
    background: #FFB6C1;
    color: #FFF;
    display: block; margin: 0;
    padding: 9px 12px 10px 12px;
    text-decoration: none;
    }
    </style>


    grazie a tutti in anticipo
    Rispondi quotando Rispondi quotando
  2. 20-05-2015, 22:09 #2
    carlomarangoni
    carlomarangoni non è in linea
    Moderatore di HTML5 L'avatar di carlomarangoni
    Registrato dal
    Apr 2010
    Messaggi
    6,280
    codice:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Documento senza titolo</title>
<style type="text/css">
#menuhome {
background: #FFFFFF;
width: 710px;
color: #FFF;
margin: 0 auto;
padding: 0;
text-align: left;
position: relative;
border-top:0px solid #FFF;
height:40px;
}
#menu {
margin: 0;
padding: 0;
}
#menu ul {
float: right;
list-style: none;
margin: 0;
padding: 0;
}
#menu li {
list-style: none;
margin: 0;
padding: 0;
}
#menu li a, #menu li a:link, #menu li a:visited {
color: #C71585;
display: block;
font: normal 20px Lucida Calligraphy; margin: 0;
padding: 8px 12px 8px 12px;
text-align: center;
text-decoration: none;
height:25px;
}
#menu li a:hover, #menu li a:active {
background: #90EE90;
color: #C71585;
display: block;
text-decoration: none;
margin: 0;
padding: 8px 12px 8px 12px;
}
#menu li {
float: left;
padding: 0;
}
#menu li ul {
z-index: 4444;
position: absolute;
left: -444em;
height: auto;
width: 140px;
margin: 0;
padding: 0;
}
#menu li ul a {
width: 140px;
}
#menu li ul ul {
margin: -60px 0 0 100px;
}
#menu li:hover ul ul, #menu li:hover ul ul ul, #menu li.sfhover ul ul, #menu li.sfhover ul ul ul {
left: -999em;
}
#menu li:hover ul, #menu li li:hover ul, #menu li li li:hover ul, #menu li.sfhover ul, #menu li li.sfhover ul {
left: auto;
}
#menu li:hover ul, #menu li li:hover ul, #menu li li li:hover ul, #menu li.sfhover ul, #menu li li.sfhover ul {
left: auto;
}
#menu li li a, #menu li li a:link, #menu li li a:visited {
background: "#90EE90";
width: 168px;
color: #C71585;
display: block;
font: normal 14px Lucida Calligraphy, sans-serif;
margin: 0;
padding: 9px 14px 10px 14px;
text-decoration: none;
z-index:9999;
border-bottom:0px dotted #FFF;
}
#menu li li a:hover, #menu li li a:active {
background: #FFB6C1;
color: #FFF;
display: block; margin: 0;
padding: 9px 12px 10px 12px;
text-decoration: none;
}
</style>
</head>

<body>
<div id='menuhome'>
<ul id='menu'>
<li><a href="#">Home</a></li>
<li><a href="#">Chi siamo</a></li>
<li><a href="#">I nostri prodotti</a>
<ul>
<li><a href="#">Medicina naturale</a></li>
<li><a href="#">Cosmetici</a></li>
<li><a href="#">Tisane e Infusi</a></li>
</ul>
<li><a href="#">Compra online</a></li>
<li><a href="#">Contatti</a></li>
</ul>
</div>
</DIV>
</body>
</html>
    “Che le cose siano cosi, non vuol dire che debbano andare così. Solo che quando si tratta di rimboccarsi le maniche e incominciare a cambiare, vi è un prezzo da pagare. Ed è allora che la stragrande maggioranza preferisce lamentarsi più che fare”.

    Giovanni Falcone
    Rispondi quotando Rispondi quotando
  3. 21-05-2015, 00:18 #3
    Chloe Chloe
    Chloe Chloe non è in linea
    Utente di HTML.it
    Registrato dal
    May 2015
    Messaggi
    3
    grazie di tutto!!!
    Rispondi quotando Rispondi quotando
« Discussione precedente | Prossima discussione »

Permessi di invio

  • Non puoi inserire discussioni
  • Non puoi inserire repliche
  • Non puoi inserire allegati
  • Non puoi modificare i tuoi messaggi
  •  

Regole del Forum

Powered by vBulletin® Version 4.2.1
Copyright © 2025 vBulletin Solutions, Inc. All rights reserved.