Горизонтальное расположение иконок

13 views
Skip to first unread message

Stan Vick

unread,
Jun 1, 2015, 11:44:38 PM6/1/15
to russian-blogg...@googlegroups.com
Здравствуйте. 

Сложилось так, что в верстке я не хорош, но пытаюсь сделать на блоггере некое подобие сайта-портфолио.
Возникла ситуация.

В шапку блога я хочу добавить несколько иконок, что будут выступать в роли ссылок.

Есть код меню в шаблоне:
#menu ul {
margin-top:30px;
margin-left:30px;
float:left;
width: 50%
}

...и код самих кнопок:

<ul>
<div style= 'float:left'>
<a class='feed-link' href='###'><img height='18'  width='18' src='###'/></a></div>

<div style= 'float:left'>
<a class='feed-link' href=###'><img height='18' width='18' src='###' /></a></div>

<div style= 'float:left'>
<a class='feed-link' href='###'><img height='18'  width='18' src='###' /></a></div>
         </ul>

Иконки эти стоят вплотную друг другу, а хотелось бы иметь между ними некое расстояние.
Понимаю, что проблема либо во float либо в padding и подобном, но метод тыка уже надоел.

Спасибо.

SEO-Дилетант'ка

unread,
Nov 25, 2015, 11:09:02 PM11/25/15
to Russian Blogger Help Group (по-русски)
Во-первых, у вас в коде ошибка. Если используете списки
<ul>
<li>пункт списка</li>
<li>пункт списка</li>
<li>пункт списка</li>
</ul>



то в вашем коде нет самих пунктов списка. Соответственно, лишними будут контейнеры div.
В таком случае верхний код должен быть следующим:
#menu ul li {
margin-top:30px;
margin-left:30px;
float:left;
width: 50%; /*здесь должна быть ширина каждого пункта списка, т.е. ширина одной иконки, 5 иконок - это 100/5=20%*/
}
должно получиться, по крайней мере будете знать, куда двигаться дальше.

вторник, 2 июня 2015 г., 7:44:38 UTC+4 пользователь Stan Vick написал:
Reply all
Reply to author
Forward
0 new messages