X   Сообщение сайта
(Сообщение закроется через 3 секунды)



 

Здравствуйте, гость (

| Вход | Регистрация )

Открыть тему
Тема закрыта
> Проблема с position:relative
FelixRaven
FelixRaven
Topic Starter сообщение 19.5.2011, 16:22; Ответить: FelixRaven
Сообщение #1


возникла проблема при верстке
смотрим на скрин
[IMG]http://phorum.armavir.ru/uploads/imgs/pre_1305807500__--4.png[/IMG]

смотрите, меню - ДЕПУТАТЫ получилось не поверх слайдера а под ним почему то....
ниже приведу CSS меню и слайдера, помогите пожалуста

Меню
[CSS]
#nav, #nav ul {
list-style: none;
margin: 0;
padding: 0;
float: left;
width: 100%;


}
#nav li {
float: left;
position: relative;
background: none;
}
#nav li ul {
display: none;
position: absolute;
padding: 8px 0;
width: 138px;
}
#nav a {
color: #444;
font-size: 14px;
text-decoration: none;
display: block;
padding: 4px 8px;
margin-left: 1px;
}
#nav a:hover {
color: #000;
}
#nav li:hover,
#nav li.jshover {

}
#nav li li a {

width: 165px;
background-color: #fff;
margin-top: -6px;
border-bottom-width: 5px; /* Толщина линии внизу */
border-bottom-style: solid; /* Стиль линии внизу */
border-bottom-color: #e2e2e2; /* Цвет линии внизу */
}
#nav li:hover ul,
#nav li.jshover ul {
display: block;
}
#nav li:hover li ul,
#nav li.jshover li ul {
display: none;
width: 138px;
top: -9px;
left: 133px;
}
#nav li:hover li:hover ul,
#nav li.jshover li.jshover ul {
display: block;
}[/CSS]

Слайдер
[CSS]
#featured{
width:400px;
padding-right:250px;
margin-left: 15px;
position:relative;
height:280px;

}
#featured ul.ui-tabs-nav{
position:absolute;
top:0; left:400px;
list-style:none;
padding:0; margin:0;
width:250px;
}
#featured ul.ui-tabs-nav li{
padding:1px 0; padding-left:13px;
font-size:12px;
color:#666;
}
#featured ul.ui-tabs-nav li img{
float:left; margin:2px 5px;
background:#fff;
padding:2px;
border:1px solid #eee;
}
#featured ul.ui-tabs-nav li span{
font-size:11px; font-family:Verdana;
line-height:18px;
}
#featured li.ui-tabs-nav-item a{
display:block;
height:60px;
color:#f4f4f4; background:#2a2a2a;
line-height:20px;
}
#featured li.ui-tabs-nav-item a:hover{
background:#3d3d3d;
}
#featured li.ui-tabs-selected{
background:url('images/select.png') top left no-repeat;
}
#featured ul.ui-tabs-nav li.ui-tabs-selected a{
background:#3d3d3d;
}
#featured .ui-tabs-panel{
width:400px; height:250px;
background:#999; position:relative;
}
#featured .ui-tabs-panel .info{
position:absolute;
top:180px; left:0;
height:70px;
background: url('images/transparent-bg.png');
}
#featured .info h2{
font-size:18px; font-family:Georgia, serif;
color:#fff; padding:5px; margin:0;
overflow:hidden;
}
#featured .info p{
margin:0 5px;
font-family:Verdana; font-size:11px;
line-height:15px; color:#f0f0f0;
}
#featured .info a{
text-decoration:none;
color:#fff;
}
#featured .info a:hover{
text-decoration:underline;
}
#featured .ui-tabs-hide{
display:none;
}[/CSS]
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
P0ZiTR0N
P0ZiTR0N
сообщение 19.5.2011, 16:35; Ответить: P0ZiTR0N
Сообщение #2


html код бы... по одному стилю вообще не определить как у вас идентифицируется id депутатов :)
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
FelixRaven
FelixRaven
Topic Starter сообщение 19.5.2011, 16:41; Ответить: FelixRaven
Сообщение #3


<ul id="nav">
<li><a href="#null">ГЛАВНАЯ</a></li>
<li><a href="#null">НОВОКУБАНСКИЙ РАЙОН</a>
<ul>
<li><a href="#null">Справка</a></li>
<li><a href="#null">История</a></li>
<li><a href="#null">Официальные символы</a></li>
</ul>
<li><a href="#null">СОВЕТ РАЙОНА</a>
<ul>
<li><a href="#null">О Совете</a></li>
<li><a href="#null">Нормативные правовые акты</a></li>
<li><a href="#null">Решения</a></li>
<li><a href="#null">Проекты решений</a></li>
<li><a href="#null">Проект устава</a></li>
</ul>
<li><a href="#null">ПРЕДСЕДАТЕЛЬ</a>
<li><a href="#null">ДЕПУТАТЫ</a>
<ul>
<li><a href="#null">Депутаты V созыва</a></li>
<li><a href="#null">Депутаты IV созыва</a></li>
<li><a href="#null">Депутаты III созыва</a></li>
<li><a href="#null">Депутаты II созыва</a></li>
<li><a href="#null">Депутаты I созыва</a></li>

</ul>
<li><a href="#null">КОМИССИИ</a>
<li><a href="#null">ФРАКЦИИ</a>
<li><a href="#null">ДЕЯТЕЛЬНОСТЬ</a>

<ul>
<li><a href="#null">план работы</a></li>
<li><a href="#null">график приема</a></li>
<li><a href="#null">информация</a></li>

</ul>
</li>
</ul>



Вот скрипт слайдера

<div id="featured" >
<ul class="ui-tabs-nav">
<li class="ui-tabs-nav-item ui-tabs-selected" id="nav-fragment-1"><a href="#fragment-1"><img src="images/image1-small.jpg" alt="" /><span>15+ Excellent High Speed Photographs</span></a></li>
<li class="ui-tabs-nav-item" id="nav-fragment-2"><a href="#fragment-2"><img src="images/image2-small.jpg" alt="" /><span>20 Beautiful Long Exposure Photographs</span></a></li>
<li class="ui-tabs-nav-item" id="nav-fragment-3"><a href="#fragment-3"><img src="images/image3-small.jpg" alt="" /><span>35 Amazing Logo Designs</span></a></li>
<li class="ui-tabs-nav-item" id="nav-fragment-4"><a href="#fragment-4"><img src="images/image4-small.jpg" alt="" /><span>Create a Vintage Photograph in Photoshop</span></a></li>
</ul>

<!-- First Content -->
<div id="fragment-1" class="ui-tabs-panel" style="">
<img src="images/image1.jpg" alt="" />
<div class="info" >
<h2><a href="#" >15+ Excellent High Speed Photographs</a></h2>
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla tincidunt condimentum lacus. Pellentesque ut diam....<a href="#" >read more</a></p>
</div>
</div>

<!-- Second Content -->
<div id="fragment-2" class="ui-tabs-panel ui-tabs-hide" style="">
<img src="images/image2.jpg" alt="" />
<div class="info" >
<h2><a href="#" >20 Beautiful Long Exposure Photographs</a></h2>
<p>Vestibulum leo quam, accumsan nec porttitor a, euismod ac tortor. Sed ipsum lorem, sagittis non egestas id, suscipit....<a href="#" >read more</a></p>
</div>
</div>

<!-- Third Content -->
<div id="fragment-3" class="ui-tabs-panel ui-tabs-hide" style="">
<img src="images/image3.jpg" alt="" />
<div class="info" >
<h2><a href="#" >35 Amazing Logo Designs</a></h2>
<p>liquam erat volutpat. Proin id volutpat nisi. Nulla facilisi. Curabitur facilisis sollicitudin ornare....<a href="#" >read more</a></p>
</div>
</div>

<!-- Fourth Content -->
<div id="fragment-4" class="ui-tabs-panel ui-tabs-hide" style="">
<img src="images/image4.jpg" alt="" />
<div class="info" >
<h2><a href="#" >Create a Vintage Photograph in Photoshop</a></h2>
<p>Quisque sed orci ut lacus viverra interdum ornare sed est. Donec porta, erat eu pretium luctus, leo augue sodales....<a href="#" >read more</a></p>
</div>
</div>

</div>
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Albatros
Albatros
сообщение 19.5.2011, 17:03; Ответить: Albatros
Сообщение #4


Добавьте z-index в
[CSS]
#nav li ul {
z-index: 10;
}[/CSS]
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
FelixRaven
FelixRaven
Topic Starter сообщение 19.5.2011, 17:07; Ответить: FelixRaven
Сообщение #5


Отлично! Спасибо! работает!

Замечание модератора:
Эта тема была закрыта автоматически ввиду отсутствия активности в ней на протяжении 100+ дней.
Если Вы считаете ее актуальной и хотите оставить сообщение, то воспользуйтесь кнопкой
или обратитесь к любому из модераторов.
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Открыть тему
Тема закрыта
1 чел. читают эту тему (гостей: 1, скрытых пользователей: 0)
Пользователей: 0


Свернуть

> Похожие темы

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Проблема с админкой
5 Prok 2315 29.7.2019, 20:04
автор: dvakarandasha
Открытая тема (нет новых ответов) Тема имеет прикрепленные файлыПроблема с таблицей, которая выводится через скрипт
7 vanchester 1335 15.2.2019, 19:06
автор: Artos_mw
Открытая тема (нет новых ответов) Тема имеет прикрепленные файлыПроблема в тегах при сохранении контента
1 Kord18 1403 13.3.2018, 18:19
автор: Evgeniy3200
Открытая тема (нет новых ответов) Тема имеет прикрепленные файлыПроблема вёрстки адаптивной страницы на divах
28 master-vek 4712 8.2.2018, 19:29
автор: master-vek
Открытая тема (нет новых ответов) Проблема с All in one SEO?
17 okseo 2680 30.11.2017, 14:06
автор: okseo


 



RSS Текстовая версия Сейчас: 28.3.2024, 21:34
Дизайн