Малък проблем с CSS

rumchi

Registered
Код:
 <style type="text/css"> 
#nav { 
background-color: #D5D5D5; 
border: 1px solid #B8B8B8; 
padding-top: 8px; 
height: 21px; 
padding-left: 3px; 
} 
#nav a { 
border: 1px solid #B7B7B7; 
padding: 4px; 
background-color: #F3F3F3; 
color: #0077B4; 
font-weight: bold; 
text-decoration: none; 
font-family: Verdana, Sans-Serif; 
font-size: 12px; 
} 
#nav a:hover { 
color: #00A8FF; 
background-color: #ffffff; 
border: 1px solid #727272; 
border-bottom: 1px solid #ffffff; 
} 
</style>

Използвам за меню този код както и

Код:
<div id="nav"> 
<center>
<a href="">Page</a> <a href="">Neshto si</a> <a href="">Page</a>
</center></div>

Но бутоните не са равни. Как ще стане всички бутони да са с един и същ размер
 
Равни на височина или на широчина?
За широчина добавяш:
width: **px;
Като гледам имаш за височина...
 
Nathan каза:
Равни на височина или на широчина?
За широчина добавяш:
width: **px;
Като гледам имаш за височина...
САмо с width няма да стане.Трябва да му зададеш и :
display:block;
, но веднага ще се подредят един под друг.Затова се ползват списъци за тази цел
 
rumchi каза:
Няма ли начин с ДИВА да се направи?
Има!
Ето:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>Untitled Document</title>
<style type="text/css">
#nav {
background-color: #D5D5D5;
border: 1px solid #B8B8B8;
padding-top: 8px;
height: 21px;
padding-left: 3px;
}
#nav a {
border: 1px solid #B7B7B7;
padding: 4px;
background-color: #F3F3F3;
color: #0077B4;
font-weight: bold;
text-decoration: none;
font-family: Verdana, Sans-Serif;
font-size: 12px;
width:100px;
display:inline-block;
}
#nav a:hover {
color: #00A8FF;
background-color: #ffffff;
border: 1px solid #727272;
border-bottom: 1px solid #ffffff;
}
</style>
</head>

<body>
<div id="nav">
<center>
<a href="">Page</a> <a href="">Neshto si</a> <a href="">Page</a>
</center></div>
</body>
</html>
 

Back
Горе