Центриране на див

unknown

Registered
Немога да центрирам един див.Ето css:
Код:
ul {
	margin:0; 
	padding:0; 
	list-style-type:none;
	font-size:0;
	}
#menu ul{
	background:url(interface.jpg) 0 0 no-repeat;
	height:30px;
	position:absolute;
	left:350px;
	padding:0 0 0 0px;
	}
#menu ul li{
	background:url(tochka.jpg) right top no-repeat;
	height:27px;
	float:left;
	padding:0 1px 0 0;
	}
#menu ul li a {
	display:block;
	background:url(interface.jpg) 0 0 repeat-x;
	padding:0 14px;
	font:bold 11px/20px Arial, Helvetica, sans-serif;
	color:#341B04;
	background-color:inherit;
	text-decoration:none;
}
#menu ul li a:hover {
	background:url(hover.jpg) 0 0 repeat-x;
	color:#fff;
	background-color:inherit;
	}
#menu ul li a.hover {
	display:block;
	background:url(hover.jpg) 0 0 repeat-x;
	color:#fff;
	padding:0 14px;
	font:bold 11px/20px Arial, Helvetica, sans-serif;
	background-color:inherit;
	text-decoration:none;
	}
#menu ul li.last {
	background-image:none;
	height:27px;
	float:left;
	}

Ето и html кода
Код:
<div id="menu" >
<ul>
<li><a href="index.php">Начало</a></li>
<li><a href="forum">Форум</a></li>
<li><a href="vicove.php">Вицове</a></li>
<li class="last"><a href="contacts.php">Контакти</a></li>
</ul>
</div>


#menu ul{
background:url(interface.jpg) 0 0 no-repeat;
height:30px;
position:absolute;
left:350px;

padding:0 0 0 0px;
}

От тук мога да нагласям колко наляво да е ,но аз искам да е центирано
 
<div id="menu" align="center">
<ul>
<li><a href="index.php">Начало</a></li>
<li><a href="forum">Форум</a></li>
<li><a href="vicove.php">Вицове</a></li>
<li class="last"><a href="contacts.php">Контакти</a></li>
</ul>
</div>
 
Нестава!
Нито
Код:
<div id="menu" align="center">
<ul>
<li><a href="index.php">Начало</a></li>
<li><a href="forum">Форум</a></li>
<li><a href="vicove.php">Вицове</a></li>
<li class="last"><a href="contacts.php">Контакти</a></li>
</ul>
</div>
Нито
Код:
<center>
<div id="menu" align="center">
<ul>
<li><a href="index.php">Начало</a></li>
<li><a href="forum">Форум</a></li>
<li><a href="vicove.php">Вицове</a></li>
<li class="last"><a href="contacts.php">Контакти</a></li>
</ul>
</div></center>
 
<table align="center">
<div id="menu">
<ul>
<li><a href="index.php">Начало</a></li>
<li><a href="forum">Форум</a></li>
<li><a href="vicove.php">Вицове</a></li>
<li class="last"><a href="contacts.php">Контакти</a></li>
</ul>
</div>
</table>
Я го пробвай така
 
Ти с кой браузър си?
Аз с мозила и експлорера отворих и на двете излиза по средата на страницата без да се центрира.Друг е въпроса,че align не му дейтва.
 
Код:
#menu { margin:10px auto; width:300px; height:100px; border:1px solid #999; }
#menu ul{
   list-style:none;
   background:url(interface.jpg) 0 0 no-repeat;
   height:30px;
   left:350px;
   padding:0 0 0 0px;
   }
#menu ul li{
   background:url(tochka.jpg) right top no-repeat;
   height:27px;
   float:left;
   padding:0 1px 0 0;
   }
#menu ul li a {
   display:block;
   background:url(interface.jpg) 0 0 repeat-x;
   padding:0 14px;
   font:bold 11px/20px Arial, Helvetica, sans-serif;
   color:#341B04;
   background-color:inherit;
   text-decoration:none;
}
#menu ul li a:hover {
   background:url(hover.jpg) 0 0 repeat-x;
   color:#fff;
   background-color:inherit;
   }
#menu ul li a.hover {
   display:block;
   background:url(hover.jpg) 0 0 repeat-x;
   color:#fff;
   padding:0 14px;
   font:bold 11px/20px Arial, Helvetica, sans-serif;
   background-color:inherit;
   text-decoration:none;
   }
#menu ul li.last {
   background-image:none;
   height:27px;
   float:left;
   }

Размерите на дива си слагаш твой избрани. Не може да се центрира див без зададени за него атрибути.Така в момента както съм го написал е точно центриран :)
 
Код:
Код:
#menu { margin:10px auto; width:300px; height:100px; border:1px solid #999; }
#menu ul{
   list-style:none;
   background:url(interface.jpg) 0 0 no-repeat;
   height:30px;
   left:350px;
   padding:0 0 0 0px;
   }
#menu ul li{
   background:url(tochka.jpg) right top no-repeat;
   height:27px;
   float:left;
   padding:0 1px 0 0;
   }
#menu ul li a {
   display:block;
   background:url(interface.jpg) 0 0 repeat-x;
   padding:0 14px;
   font:bold 11px/20px Arial, Helvetica, sans-serif;
   color:#341B04;
   background-color:inherit;
   text-decoration:none;
}
#menu ul li a:hover {
   background:url(hover.jpg) 0 0 repeat-x;
   color:#fff;
   background-color:inherit;
   }
#menu ul li a.hover {
   display:block;
   background:url(hover.jpg) 0 0 repeat-x;
   color:#fff;
   padding:0 14px;
   font:bold 11px/20px Arial, Helvetica, sans-serif;
   background-color:inherit;
   text-decoration:none;
   }
#menu ul li.last {
   background-image:none;
   height:27px;
   float:left;
   }


Размерите на дива си слагаш твой избрани. Не може да се центрира див без зададени за него атрибути.Така в момента както съм го написал е точно центриран Smile

Виж ми 1-вия пост,мога да наглясям точна позиция ,но неискам искам да е центрирано.

@BahFullFen
В момента е центрирано но ако промениш

position:absolute;
left:350px;

няма да е!

@adrian Пробвах

ul {
margin:0;
padding:0;
list-style-type:none;
font-size:0;
}
#menu ul{
background:url(interface.jpg) 0 0 no-repeat;
height:30px;
margin-left: auto;
margin-right: auto;

padding:0 0 0 0px;
}
#menu ul li{
background:url(tochka.jpg) right top no-repeat;
height:27px;
float:left;
padding:0 1px 0 0;
}
#menu ul li a {
display:block;
background:url(interface.jpg) 0 0 repeat-x;
padding:0 14px;
font:bold 11px/20px Arial, Helvetica, sans-serif;
color:#341B04;
background-color:inherit;
text-decoration:none;
}
#menu ul li a:hover {
background:url(hover.jpg) 0 0 repeat-x;
color:#fff;
background-color:inherit;
}
#menu ul li a.hover {
display:block;
background:url(hover.jpg) 0 0 repeat-x;
color:#fff;
padding:0 14px;
font:bold 11px/20px Arial, Helvetica, sans-serif;
background-color:inherit;
text-decoration:none;
}
#menu ul li.last {
background-image:none;
height:27px;
float:left;
}


Код:
<center>
<div id="menu" align="center" >
<ul>
<li><a href="index.php">Начало</a></li>
<li><a href="forum">Форум</a></li>
<li><a href="vicove.php">Вицове</a></li>
<li class="last"><a href="contacts.php">Контакти</a></li>
</ul>
</div></center>

Но пак не е центрирано
 
Като махнеш position:absolute; и float:left; се центрира.Трябва да ги заместиш с нещо друго за да се центрира.
 
Промени целия код и го пеистни тука,че не ми се получава

Edit:Така се променя формата на менюто,нямали друг начин ?
 
unknown каза:
Промени целия код и го пеистни тука,че не ми се получава

Edit:Така се променя формата на менюто,нямали друг начин ?

Знам,че ти променя формата,но ако има друг начин да се получи същия ефект съм сигурен,че ще се центрира.
А за кода просто махни горе посочените неща и ще се центрира,но няма да е на един ред и ще мига здраво :)
 
unknown каза:
Код:
Код:
#menu { margin:10px auto; width:300px; height:100px; border:1px solid #999; }
#menu ul{
   list-style:none;
   background:url(interface.jpg) 0 0 no-repeat;
   height:30px;
   left:350px;
   padding:0 0 0 0px;
   }
#menu ul li{
   background:url(tochka.jpg) right top no-repeat;
   height:27px;
   float:left;
   padding:0 1px 0 0;
   }
#menu ul li a {
   display:block;
   background:url(interface.jpg) 0 0 repeat-x;
   padding:0 14px;
   font:bold 11px/20px Arial, Helvetica, sans-serif;
   color:#341B04;
   background-color:inherit;
   text-decoration:none;
}
#menu ul li a:hover {
   background:url(hover.jpg) 0 0 repeat-x;
   color:#fff;
   background-color:inherit;
   }
#menu ul li a.hover {
   display:block;
   background:url(hover.jpg) 0 0 repeat-x;
   color:#fff;
   padding:0 14px;
   font:bold 11px/20px Arial, Helvetica, sans-serif;
   background-color:inherit;
   text-decoration:none;
   }
#menu ul li.last {
   background-image:none;
   height:27px;
   float:left;
   }


Размерите на дива си слагаш твой избрани. Не може да се центрира див без зададени за него атрибути.Така в момента както съм го написал е точно центриран Smile

Виж ми 1-вия пост,мога да наглясям точна позиция ,но неискам искам да е центрирано.

@BahFullFen
В момента е центрирано но ако промениш

position:absolute;
left:350px;

няма да е!

@adrian Пробвах

ul {
margin:0;
padding:0;
list-style-type:none;
font-size:0;
}
#menu ul{
background:url(interface.jpg) 0 0 no-repeat;
height:30px;
margin-left: auto;
margin-right: auto;

padding:0 0 0 0px;
}
#menu ul li{
background:url(tochka.jpg) right top no-repeat;
height:27px;
float:left;
padding:0 1px 0 0;
}
#menu ul li a {
display:block;
background:url(interface.jpg) 0 0 repeat-x;
padding:0 14px;
font:bold 11px/20px Arial, Helvetica, sans-serif;
color:#341B04;
background-color:inherit;
text-decoration:none;
}
#menu ul li a:hover {
background:url(hover.jpg) 0 0 repeat-x;
color:#fff;
background-color:inherit;
}
#menu ul li a.hover {
display:block;
background:url(hover.jpg) 0 0 repeat-x;
color:#fff;
padding:0 14px;
font:bold 11px/20px Arial, Helvetica, sans-serif;
background-color:inherit;
text-decoration:none;
}
#menu ul li.last {
background-image:none;
height:27px;
float:left;
}


Код:
<center>
<div id="menu" align="center" >
<ul>
<li><a href="index.php">Начало</a></li>
<li><a href="forum">Форум</a></li>
<li><a href="vicove.php">Вицове</a></li>
<li class="last"><a href="contacts.php">Контакти</a></li>
</ul>
</div></center>

Но пак не е центрирано

За да бъде центрирано, трябва да му зададеш и width :)
 
adrian каза:
unknown каза:
Код:
Код:
#menu { margin:10px auto; width:300px; height:100px; border:1px solid #999; }
#menu ul{
   list-style:none;
   background:url(interface.jpg) 0 0 no-repeat;
   height:30px;
   left:350px;
   padding:0 0 0 0px;
   }
#menu ul li{
   background:url(tochka.jpg) right top no-repeat;
   height:27px;
   float:left;
   padding:0 1px 0 0;
   }
#menu ul li a {
   display:block;
   background:url(interface.jpg) 0 0 repeat-x;
   padding:0 14px;
   font:bold 11px/20px Arial, Helvetica, sans-serif;
   color:#341B04;
   background-color:inherit;
   text-decoration:none;
}
#menu ul li a:hover {
   background:url(hover.jpg) 0 0 repeat-x;
   color:#fff;
   background-color:inherit;
   }
#menu ul li a.hover {
   display:block;
   background:url(hover.jpg) 0 0 repeat-x;
   color:#fff;
   padding:0 14px;
   font:bold 11px/20px Arial, Helvetica, sans-serif;
   background-color:inherit;
   text-decoration:none;
   }
#menu ul li.last {
   background-image:none;
   height:27px;
   float:left;
   }


Размерите на дива си слагаш твой избрани. Не може да се центрира див без зададени за него атрибути.Така в момента както съм го написал е точно центриран Smile

Виж ми 1-вия пост,мога да наглясям точна позиция ,но неискам искам да е центрирано.

@BahFullFen
В момента е центрирано но ако промениш

position:absolute;
left:350px;

няма да е!

@adrian Пробвах

ul {
margin:0;
padding:0;
list-style-type:none;
font-size:0;
}
#menu ul{
background:url(interface.jpg) 0 0 no-repeat;
height:30px;
margin-left: auto;
margin-right: auto;

padding:0 0 0 0px;
}
#menu ul li{
background:url(tochka.jpg) right top no-repeat;
height:27px;
float:left;
padding:0 1px 0 0;
}
#menu ul li a {
display:block;
background:url(interface.jpg) 0 0 repeat-x;
padding:0 14px;
font:bold 11px/20px Arial, Helvetica, sans-serif;
color:#341B04;
background-color:inherit;
text-decoration:none;
}
#menu ul li a:hover {
background:url(hover.jpg) 0 0 repeat-x;
color:#fff;
background-color:inherit;
}
#menu ul li a.hover {
display:block;
background:url(hover.jpg) 0 0 repeat-x;
color:#fff;
padding:0 14px;
font:bold 11px/20px Arial, Helvetica, sans-serif;
background-color:inherit;
text-decoration:none;
}
#menu ul li.last {
background-image:none;
height:27px;
float:left;
}


Код:
<center>
<div id="menu" align="center" >
<ul>
<li><a href="index.php">Начало</a></li>
<li><a href="forum">Форум</a></li>
<li><a href="vicove.php">Вицове</a></li>
<li class="last"><a href="contacts.php">Контакти</a></li>
</ul>
</div></center>

Но пак не е центрирано

За да бъде центрирано, трябва да му зададеш и width :)

Така ме устройва :)
А имали някакъв начин само да си определя width пак да е центрирано.(width:auto) или нещо от тоя сорт.


+1
 

Back
Горе