Меню выстраивается в лесенку.
Posted: Tue Mar 20, 2012 10:41 am
Всем привет. Очень понравился ваш CMSMS, натянул свой шаблон на него, но вот с меню возникли какие-то непонятки.
прикладываю два скрина. на первом - хтмл шаблон, так как должно быть. (не псд, верстку уже прошел и в хтмл+цсс все выглядит так как надо). на втором - натянутый на движок. меню сбивается в лесенку. перед первой ссылкой появились какието точечки.
разъясните пожалуйста, почему такое происходит? стили и верстку шаблона уже перепроверил по нескольку раз.
вот код шаблона хтмл:
а это цсс:
пробовал ограничивать высоту строки в таблице, в которой находится строка с меню - не помогает.
прикладываю два скрина. на первом - хтмл шаблон, так как должно быть. (не псд, верстку уже прошел и в хтмл+цсс все выглядит так как надо). на втором - натянутый на движок. меню сбивается в лесенку. перед первой ссылкой появились какието точечки.
разъясните пожалуйста, почему такое происходит? стили и верстку шаблона уже перепроверил по нескольку раз.
вот код шаблона хтмл:
Code: Select all
<__html>
<head>
<title>{title}</title>
{metadata}
{cms_stylesheet}
</head>
</__body>
<div class="wrapper">
<!-- шапка -->
<div class="logo"></div>
<!-- строка с меню -->
<div class="menubar_lt"></div>
<div class="menu_links">
<table cellspacing="0" border=0 width="800">
<tr>
<td>
{menu number_of_levels="1"}
</td>
<td>
<a class="ro" href=#>форум</a>
</td>
</tr>
</table>
</div>
<div class="menubar_rt"></div>
<!-- контент -->
<table cellspacing="0">
<tr>
<td width="112" background="./uploads/images/left.png">
</td>
<td width="795" bgcolor="white">{content}
</td>
<td width="115" background="./uploads/images/right.png">
</td>
</tr>
</table>
<!-- подвал -->
<div class="footer" align="center"><br><font class="shadow" face="Verdana" size="2" color="#252525"><b>Audi 200 Club | 2006 — 2011 ©</b></font></div>
</div>
<__body>
</__html>
Code: Select all
body {
background-color: black;
font-family: 'Courier New', Courier, monospace;
}
.wrapper {
margin: 0 auto;
width: 1024px;
}
.logo {
width: 1024px;
height: 114px;
background: url('[[root_url]]/uploads/images/logo.png') no-repeat;
}
.content {
background: #373737;
width: 1024px;
}
.menubar_lt {
float: left;
width: 114px;
height: 42px;
background: url('[[root_url]]/uploads/images/links-lt.png');
}
.menu_links {
float: left;
width: 793px;
height: 42px;
background: url('[[root_url]]/uploads/images/links.png') repeat-x;
}
.menubar_rt {
width: 117px;
height: 42px;
background: url('[[root_url]]/uploads/images/links-rt.png');
}
.menu_links a {
display: block;
line-height: 42px;
padding-left: 15px;
padding-right: 15px;
font-size: 22px;
float: left;
color: white;
font-weight: bold;
text-decoration: none;
}
.menu_links a:hover {
font-size: 22px;
color: #e62d3e;
font-weight: bold;
}
a.ro:link {
text-decoration: none;
font-size: 22px;
color: #e62d3e;
font-weight: bold;
}
a.ro:visited {
text-decoration: none;
font-size: 22px;
color: #e62d3e;
font-weight: bold;
}
a.ro:active {
text-decoration: none;
font-size: 22px;
color: white;
font-weight: bold;
}
a.ro:hover {
text-decoration: none;
font-size: 22px;
color: white;
font-weight: bold;
}
.footer {
width: 1024px;
height: 59;
background: url('[[root_url]]/uploads/images/footer.png') no-repeat;
}
.shadow {
text-shadow: #999 2px 0 0px, #999 0 2px 0px;
}