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



 

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

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

Открыть тему
Тема закрыта
> Список с разными маркерами
Newbie256
Newbie256
Topic Starter сообщение 28.8.2010, 3:41; Ответить: Newbie256
Сообщение #1


Как правильно сделать список
чтобы у каждого элемента списка была своя картинка-маркер

создал Вот такой список:

[IMG]http://img-fotki.yandex.ru/get/4510/myguest2011.0/0_38f25_b58e875e_M.jpg[/IMG]

<div id="menu8">
<ul>

<li><a href="#1"><span id="one"> Подсолнух</span></a></li>
<li><a href="#2"><span id="two"> Лютик</span></a></li>
<li><a href="#3"><span id="three"> Ромашка</span></a></li>

</ul>
</div>


сss-код:
#menu ul {
  list-style-type: none;  
}

#menu {
width: 220px;
padding-right: 20px;
margin-top: 10px;
}

#menu {
width: 220px;
padding-right: 20px;
margin-top: 10px;
}

#menu li a {
text-decoration: none;

}

#menu li a:link, #menu8 li a:visited {
color: #777;
display: block;
padding: 17px 0 0 20px;
margin: 0px 0px 10px 0px;
}

#menu li a:hover {
padding: 17px 0 0 20px;
margin: 0px 0px 10px 0px;
}

#menu li a:active {
color: #777;
padding: 17px 0 0 20px;
margin: 0px 0px 10px 0px;
}


#one  {
background: url(img/yelowflower.png)  no-repeat;
border : 1px solid black;
}

#two  {
background: url(img/redflower.png)  no-repeat;
border : 1px solid black;
}

#three {
background: url(img/blueflower.png)  no-repeat;
border : 1px solid black;
}



но почему-то при нажатии на эти ссылки-элементы списка они смещаются таким образом:

[IMG]http://img-fotki.yandex.ru/get/4505/myguest2011.0/0_38f26_85b38d12_M.jpg[/IMG]


Подскажите, пожалуйста, может что-нибудь надо подправить, где может быть ошибка. и как её исправить.
0
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Apay
Apay
сообщение 28.8.2010, 14:30; Ответить: Apay
Сообщение #2


попробуйте в добавить
#menu a { clear:both; }
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Newbie256
Newbie256
Topic Starter сообщение 28.8.2010, 15:35; Ответить: Newbie256
Сообщение #3


попробовал, не помагает #menu a { clear:both; }, все равно элементы наезжают друг на друга
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Apay
Apay
сообщение 28.8.2010, 17:11; Ответить: Apay
Сообщение #4


все дело в css, у вас сильно отличаются a и a:visited, при нажатии a становится a:visited, я бы сделал так:
#menu ul { list-style:none; padding:0; }
#menu a { display:block; text-decoration: none; padding:2px 0 0 25px; height:23px; background: no-repeat left center; }
#menu a#one { background-image:url(yelowflower.png); }
#menu a#two { background-image:url(redflower.png); }
#menu a#three { background-image:url(blueflower.png); }

<div id="menu">
<ul>
<li><a href="#1" id="one"><span>Подсолнух</span></a></li>
<li><a href="#2" id="two"><span>Лютик</span></a></li>
<li><a href="#3" id="three"><span>Ромашка</span></a></li>
</ul>
</div>
а всякими hover подправлял только цвета и пр., а размеры не трогал
Вернуться в начало страницы
 
Ответить с цитированием данного сообщения
Newbie256
Newbie256
Topic Starter сообщение 29.8.2010, 14:42; Ответить: Newbie256
Сообщение #5


нашел у себя очепятку
в #menu8 li a:visited
вместо menu написал menu8 ;)

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


Свернуть

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

  Тема Ответов Автор Просмотров Последний ответ
Открытая тема (нет новых ответов) Тема имеет прикрепленные файлыБелый и чёрный список копирайтеров и рерайтеров.
15 GVA 8815 7.11.2019, 18:53
автор: mkreine
Открытая тема (нет новых ответов) Список всех зарегистрированных доменов. Более 290 млн
12 phosphoruss 8878 25.10.2019, 23:50
автор: uahomka
Открытая тема (нет новых ответов) MARKETCALL: кидалы, черный список, мошенники, не платят, кидают, кидалово
4 kuprum 2854 7.10.2019, 22:28
автор: Kiloan_Frost
Открытая тема (нет новых ответов) Есть небольшой список сайтов-доноров позволяющих размещать в комментах безанкорные dofollow ссылки
0 Tutich 1606 15.7.2019, 12:30
автор: Tutich
Открытая тема (нет новых ответов) Список форумов
с оплатой за активность
2 Retyk 4635 13.11.2017, 14:11
автор: LevFilkin


 



RSS Текстовая версия Сейчас: 26.4.2024, 9:04
Дизайн