- Home
- Categorie
- Coding e Sistemistica
- Coding
- Centrare pagina
-
Prova a metterlo in un div a cui dai style="margin: 0 auto;"
-
Mi associo a tigrone !!! Tuttavia alle volte mi è capitato, non so per quale motivo, che quel tipo di codice nel CSS non mi restituisse il div centrato. In questi casi ho risolto scrivendo in questo modo:
div#id_del_div { margin: auto; }
Il risultato è uguale in quanto la distanza "automatica" dall'alto e dal basso del div è comunque 0px !!!
Spero di esserti stato utile !!!
-
Questo è il mio codice html: [HTML]
<link href="style.css" rel="stylesheet" type="text/css"/>
</head>
<body><ul id="menu">
<li><a href="#" class="logo">Logo</a></li>
<li><a href="#" class="home">Home<span></span></a></li>
<li><a href="#" class="forum">Forum<span></span></a></li>
<li><a class="spacer">Spacer</a></li>
<li><a href="#" class="upload">Upload<span></span></a></li>
</ul>
</body>
</html>
[/HTML]e questo è il css: [HTML]#menu {
list-style: none;
padding: -10px;
margin: -8px;
height: 170px;
background: url(menu/menuback.jpg) repeat-x;
position: center;
}
#menu span {
display: none;
position: absolute;
}
a {
display: block;
text-indent: -900%;
position: absolute;
outline: none;
}
a:hover {
background-position: left bottom;
}
a:hover span{
display: block;
}
.logo {
width: 161px;
height: 164px;
background: url(menu/logo.png) no-repeat;
left: 20px;
top: 0px;
position: center;
}
.home {
width: 94px;
height: 170px;
background: url(menu/home.jpg) no-repeat;
left: 200px;
top: 0px;
position: center;
}
.home span {
width: 94px;
height: 170px;
background: url(menu/homeon.jpg) no-repeat;
left: 0px;
top: 0px;
position: center;
}
.forum {
width: 94px;
height: 170px;
background: url(menu/forum.jpg) no-repeat;
left: 294px;
top: 0px;
position: center;
}
.forum span {
width: 94px;
height: 170px;
background: url(menu/forumon.jpg) no-repeat;
left: 0px;
top: 0px;
position: center;
}
.spacer {
width: 131px;
height: 170px;
background: url(menu/spacer.png) no-repeat;
left: 388px;
top: 0px;
position: center;
}
.upload {
width: 94px;
height: 170px;
background: url(menu/upload.jpg) no-repeat;
left: 519px;
top: 0px;
position: center;
}
.upload span {
width: 94px;
height: 170px;
background: url(menu/uploadon.jpg) no-repeat;
left: 0px;
top: 0px;
position: center;
}
{
text-align: center;
position: center;
}
[/HTML]Ho provato a seguire le vostre risposte, ma non sono riuscito a risolvere. Potete dirmi gentilmente dove devo posizionare il codice ?
-
Nell'HTML inserisci la lista in un div:
<div id="nome_del_div">
<ul>......</ul>
</div>Dopodichè nel CSS scrivi:
div#nome_del_div { margin: auto; }
Vedi come va !!!
-
Non va
-
-
Allora fai così:
<center><ul>....</ul></center>
Fammi sapere !!
-
@MarcoF. said:
Allora fai così:
Non funzionerebbe... troppo incasinato quel menu a livello di margini, background ecc...
-
beh non so !!! se non riesce con il div...è la prima cosa che mi è venuta in mente !!! tentar non nuoce !!!
-
@MarcoF. said:
beh non so !!! se non riesce con il div...è la prima cosa che mi è venuta in mente !!! tentar non nuoce !!!
Prova con ispezione elemento e te ne renderai conto.