в мене є панель
ксс
Code
/* Верхняя панель для пользователей v.1.0
============================================================================*/
#top_bar {
position:fixed;
z-index:997;
top:0;
min-width:100%;
height:55px;
background: #353535;
border-top: 1px solid #000;
box-shadow: 0px 0px 5px #111;
}
#top_bar_os {
padding:0px;
width:1024px;
height:45px;
margin: 0px auto;
}
#top_bar_os a{
text-decoration:none;
}
.td_l {
float:left;
padding:12px 10px 0px 10px;
height:40px;
background:url(http://www.center-dm.ru/ucoz/user_bar/v1/li_linia.gif) no-repeat right;
}
.td_p {
float:right;
height:45px;
padding: 0px 0px 0px 0px;
background:url(http://www.center-dm.ru/ucoz/user_bar/v1/li_linia.gif) no-repeat right;
}
/* Выпадающее меню
------------------------------------------*/
.menu_p {
display:block;
position:relative;
}
.menu_p .drop {
float:left;
color:#66B427;
text-shadow:1px 1px 1px #000;font-weight: 700;
padding: 10px 17px 0px 10px;
margin-right: 10px;
background:url(http://www.center-dm.ru/ucoz/user_bar/v1/drop1.png) no-repeat right 15px;
}
.menu_p:hover .drop{
background:url(http://www.center-dm.ru/ucoz/user_bar/v1/drop2.png) no-repeat right 15px;
color:#2784b4;
}
.dd_ugol1,
.dd_menu {
width:240px;
}
.dd_ugol2,
.dd_menu_p {
width:300px;
}
.dd_menu,
.dd_menu_p {
float:left;
position:absolute;
margin:0px auto;
background:#4c4c4c;
padding:5px;
left:-999em;
z-index:998;
border:1px solid #111;
-moz-border-radius:5px 5px 5px;
-webkit-border-radius:5px 5px 5px;
border-radius:5px 5px 5px;
box-shadow: 0px 0px 5px #111;
}
.menu_p:hover .dd_menu,
.menu_p:hover .dd_menu_p{
top:40px;
left:auto;
right:0px;
}
.dd_ugol1,
.dd_ugol2 {
height:25px;
float:left;
position:absolute;
top: -25px;
right: 25px;
background:url(fon_ugol_1.png) no-repeat;
background-position: right bottom;
}
.dd_ugol1 {right:2px!important;}
.dd_menu_os {width:218px;}
.mini_profil {width:278px;}
.dd_menu_os,
.mini_profil {
overflow:hidden;
background:#eee;
border: 1px solid #353535;
margin:0;
padding:10px;
}
/* Вертикальное меню
------------------------------------------*/
.menu_top {
margin:0;
padding:0;
list-style:none;
overflow:hidden;
width:238px;
background:#eee;
border: 1px solid #353535;
}
.menu_top li a:link,
.menu_top li a:visited {
display:block;
text-align:left;
color:#555;
width:100%;
padding:4px 10px;
border-bottom: 1px solid #d0d0d0;
border-top: 1px solid #fff;
}
.menu_top li a:hover {
background:#fff;
}
/* Мини профиль
------------------------------------------*/
.mini_avatar {
width:35px;
height:35px;
}
.mp_avatar {
float:right;
margin: 0px 0px 0px 0px;
width:50px;
height:50px;
border: 3px solid #666;
}
.mp_info {
float:left;
margin:0;
padding:5px;
width:200px;
list-style:none;
}
.mp_info a:link,
.mp_info a:visited{color:#2784b4; font-weight: bold;}
.mp_info a:hover {color:#66B427;}
.mp_info li {
font: 10px Verdana,Arial,Helvetica, sans-serif;
padding: 2px 0px;
border-top: 1px solid #fff;
border-bottom: 1px solid #B7B7B7;
}
.border_v {border-top:none!important;}
.border_n {border-bottom:none!important;}
.bold {font-weight: bold;}
на сторінці
Code
<!-- Начало тегов Верхняя панель для пользователей -->
<div id="top_bar">
<div id="top_bar_os">
<div class="td_l">
<a href="$HOME_PAGE_LINK$"><img alt="home" title="На главную страницу сайта" src="http://www.center-dm.ru/ucoz/user_bar/v2/icon_home.png"></a>
</div>
<div class="td_l">
<div id="search">
<div class="searchForm"><form onSubmit="this.sfSbm.disabled=true" method="get" style="margin:0" action="http://photo-hosting.ucoz.ua/search/"><div class="schQuery"><input type="text" name="q" placeholder="Поиск..." class="queryField" x-webkit-speech="" speech="" onwebkitspeechchange="this.form.submit();" /></div><div class="schBtn"><input type="submit" class="searchSbmFl" name="sfSbm" value="Найти" /></div></form></div>
</div>
</div>
<div class="menu_p td_p"> <br>
<a href="#" class="drop">Меню</a>
<div class="dd_menu">
<span class="dd_ugol2"></span>
<ul class="menu_top">
<li><a href="http://manucoz.ru">Проверка</a></li>
<li><a href="http://manucoz.ru">Проверка</a></li>
<li><a href="http://manucoz.ru">Проверка</a></li>
<li><a href="http://manucoz.ru">Проверка</a></li>
<li><a href="http://manucoz.ru">Проверка</a></li>
<li><a href="http://manucoz.ru">Проверка</a></li>
<li><a href="http://manucoz.ru">Проверка</a></li>
<li><a href="http://manucoz.ru">Проверка</a></li>
</ul>
</div>
</div>
<?if($USER_LOGGED_IN$)?>
<div class="menu_p td_p">
<a href="#"> <img class="mp_avatar" alt="аватар" title="Вы зашли на сайт как $USERNAME$" src="$USER_AVATAR_URL$">
</a>
<div class="dd_menu_p">
<span class="dd_ugol1"></span>
<div class="mini_profil">
<a title="Мой профиль" href="$PERSONAL_PAGE_LINK$">
<?if($USER_AVATAR_URL$)?>
<img class="mp_avatar" alt="аватар" title="Вы зашли на сайт как $USERNAME$" src="$USER_AVATAR_URL$">
<?else?>
<img class="mp_avatar" alt="аватар" title="Вы зашли на сайт как $USERNAME$" src="http://www.center-dm.ru/site/no_avatar.jpg">
<?endif?>
</a>
<ul class="mp_info">
<li class="border_v"><span class="bold">$USERNAME$</span></li>
<li>Твой IP: <span class="bold">$IP_ADDRESS$</span></li>
<li>Ты в группе: <span class="bold">$USER_GROUP$</span></li>
<li>Ты здесь: <span class="bold">$USER_REG_DAYS$-й день</span></li>
<li class="border_n"><a href="/index/11">Настройки профиля</a></li>
</ul>
<a href="$LOGOUT_LINK$" title="Выход" class="knopka_vixod"><!--<s5164>-->Выход<!--</s>--></a>
</div>
</div>
</div>
<div class="td_p"> <br>
<a href="$PM_URL$" title="Почта" class="knopka_pochta">Почта ($UNREAD_PM$)</a>
</div>
<?else?>
<div class="td_p">
<a href="$REGISTER_LINK$" title="Регистрация" class="knopka_reg"><!--<s3089>-->Регистрация<!--</s>--></a>
</div>
<div class="td_p">
<a href="$LOGIN_LINK$" title="Вход" class="knopka_vxod"><!--<s3087>-->Вход<!--</s>--></a>
</div>
<?endif?>
</div>
</div>
<!-- /Конец тегов Верхняя панель для пользователей -->
НУ я хочу зробити шоб сразу під цею панелю була полоска нужного цвета і нужної висоти,ну в мене між панелю і полоской получаєється невеличке ростояніє або навпаки полоса чуть вилазе на панель
вот кс панелі
Code
#header {
background: #bada55;
color: white;
font-family: Droid Sans;
font-size: 18px;
line-height: 1.6em;
font-weight: bold;
text-align: center;
padding: 0px;
height: 30px;
text-shadow: 0 1px 1px rgba(0,0,0,.2);
}
.sticky #header {
background: orange;
width: 100%;
}
Code
<div id="header" >
полоса
</div>