Deff,
у меня 5 таких кнопок, и они таким образом выравниваются в центре по левой в сторону правого края.
вот код:
@CHARSET "UTF-8";
html {
height: 100%;
width: 100%;
}
body {
margin: 0px;
height: 100%;
width: 100%;
font-family: Tahoma, Verdana, Arial;
background: #181818;
text-align: center;
color: #8f8f8f;
font-size: 12px;
}
img {
border: 0px;
}
a {
color: #8f8f8f;
font-family: Tahoma, Verdana, Arial;
font-size: 12px;
}
.item {
left:100%;
margin-left:0px;
}
a:hover {
font-family: Tahoma, Verdana, Arial;
font-size: 12px;
color: #FFF;
text-decoration: none;
}
#body {
position: relative;
height: 100%;
background: url(/images/pg/glow-top.jpg) 120px 0px no-repeat;
}
#title_main {
position: relative;
top: 30px;
margin-left: 63px;
margin-right: 63px;
overflow: hidden;
}
#title_main h2, #title_main h1 {
margin: 0px;
padding: 0px;
}
#title_main h1 {
width: 497px;
margin-top: 20px;
margin-left: 123px;
margin-right: 123px;
}
#body, #footer {
margin: auto;
width: 870px;
}
#wraper {
position: relative;
overflow: hidden;
display: table;
width: 100%;
height: 400px;
}
#container {
display: table-cell;
}
#menu {
position: relative;
margin-top: 150px;
margin-left: 0px;
margin-right: 0px;
width: 965px;
height: 117px;
}
#menu .photo, #menu .link, #menu .item, #menu #empty {
width: 137px;
height: 117px;
}
#menu .item, #menu #empty {
position: relative;
display: inline;
float: left;
margin: 0px 0px 0px 1px;
}
#menu .photo {
position: absolute;
top: 0px;
left: 0px;
z-index: 1;
background: #716a60;
}
#menu .link {
display: block;
position: relative;
overflow: hidden;
font-size: 12px;
z-index: 2;
background: #313131 url(/images/pg/menu/bg.gif) repeat-x;
color: #909090;
text-align: center;
padding-top: 50px;
height: 67px;
text-decoration: none;
font-family: tahoma,verdana,arial;
}
#menu a.link:hover {
background: #de8b2e url(/images/pg/menu/current.png) no-repeat;
color: #FFF;
}
#footer {
position: relative;
height: 75px;
width: 870px;
margin-top: 20px;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px;
padding: 0px;
text-align: left;
line-height: 13px;
font-size: 11px;
z-index: 2;
}
#footer .doted {
height: 15px;
float: left;
width: 100%;
background: url(/images/pg/doted.gif) center left repeat-x;
margin-top: 5px;
margin-bottom: 5px;
}
#footer .links {
height: 15px;
float: left;
width: 100%;
text-align:center;
}
#footer .menu {
margin: 3px 0px 0px 0px;
padding: 0px;
overflow: hidden;
height: 15px;
width: 580px;
}
#footer .menu .item {
margin: 0px 0px 0px 0px;
list-style: none;
float: left;
border-left: 1px solid #8f8f8f;
padding: 0px 4px;
overflow: hidden;
line-height: 12px;
}
#footer .menu .link {
position: relative;
top: -2px;
color: #8f8f8f;
}
#footer .menu .link:hover {
color: #FFF;
text-decoration: none;
}
#footer .menu .first {
margin-left: -5px;
}
#footer .text {
float: left;
width: 100%;
margin-top: 5px;
margin-bottom: 0px;
margin-left: 0px;
margin-right: 0px;
padding: 0px;
}
h1 {font-size:14px;}
h2 {font-size:12px;}
h3 {font-size:12px;}
