Вопрос: Как вертикальное меню переделать в горизонтальное? CSS
Есть шаблон с доступом в html и css www.problabla.jimdo.com (jimdo - платформа такая)есть и статья с небольшими подсказками http://hostoplist.ru/kak-sdelat-shablon-dlya-jimdo/Но я в этом..., ну не совсем - "0", но близко к "1-2")))
Подскажите, как перевести это меню в горизонтальное ниже шапки.
Вот исходный код CSS^
/* Typo
----------------------------------------------- */
a:link, a:visited
{
text-decoration: underline;
color:#EC4413;
}
a:active { text-decoration: underline; }
a:hover { text-decoration:none; }
h1 { font:bold 18px/140% "Trebuchet MS", Verdana, sans-serif; }
h2 { font:bold 14px/140% "Trebuchet MS", Verdana, sans-serif; }
p { font: 11px/140% Verdana, Geneva, Arial, Helvetica, sans-serif;}
/* Layout
----------------------------------------------- */
body {
background: #FFFFFF url(bg.gif) no-repeat top left;
padding:35px 0 0 0;
margin:0;
font: 11px/140% Verdana, Geneva, Arial, Helvetica, sans-serif;
}
#container
{
margin:0 auto;
width:840px;
background:white;
}
#header
{
padding:0px;
}
#header h1,
#header a
{
padding:0;
font-family:"Helvetica","Lucida Sans Unicode",Tahoma,Verdana,Arial,Helvetica,sans-serif;
font-size:30px;
font-weight:normal;
text-decoration:none;
line-height:1.3em;
color:#666666;
text-align:right;
}
#header a:hover { text-decoration:none; }
#navigation
{
float:right;
width:220px;
padding:10px;
}
#sidebar
{
padding-top:10px;
}
#content
{
float:left;
width:530px;
padding:10px;
}
#footer
{
clear:both;
margin-top:10px;
background:url(footer-bg.gif) repeat-x top;
height:65px;
}
#footer .gutter
{
height:30px;
padding:35px 15px 0 90px;
}
/* Navigation
----------------------------------------------- */
ul.mainNav1,
ul.mainNav2
{
margin:0;
padding: 0;
}
ul.mainNav1 li,
ul.mainNav2 li
{
display: inline;
margin: 0;
padding: 0;
}
ul.mainNav1 li a,
ul.mainNav2 li a
{
font:normal 11px/140% Verdana, Geneva, Arial, Helvetica, sans-serif;
text-decoration: none;
display: block;
color:#333;
border-bottom:1px solid #CCC;
}
ul.mainNav1 li a { padding:4px 4px 4px 4px; }
ul.mainNav2 li a { padding:4px 4px 4px 14px; }
ul.mainNav3 li a { padding:4px 4px 4px 24px; }
ul.mainNav1 a:hover
{
background:#EEE;
color:black;
}
ul.mainNav1 a.current { font-weight:bold; }