Как создать вертикальную линию подобно hr?

голоса: 0

Для того чтобы визуально разделить блоки.

Сейчас так:

 

Блоки будут сливатся между собой, это не красиво.

Хочу вот так приблизительно:

Только разумеется не красные жирные линии а такие аккуратные как линии hr в этом дизайне, только вертикальные.

Адрес сайта http://katalog-mob.ucoz.site
| Автор: | Категория: Дизайн сайта

Ответов: 1

голоса: 0
 
Лучший ответ

Пропишите в стили:

.footer div[style="width:33%;float:left;"]:nth-child(1),.footer div[style="width:33%;float:left;"]:nth-child(2) {border-right: 1px solid #a9a2a2; margin: 2px;}

вместо выделенного красным пропишите нужный вам цвет для данной полоски, подобрать цвет можно на сайте - http://www.color-hex.com/

| Автор:
Выбор ответа лучшим | | Автор: webanet

Получилось, но в косо при просмотре с мобильного. Как сделать чтобы полоса была 100% по высоте, или что-бы они обе одинаковые были? Получается одна короче а другая длиннее. 

Дмитрий Романенко,
Надо задать блокам фиксированную высоту.
Sentimo,
Спасибо. А как это сделать?
Дмитрий Романенко,
.footer div[style="width:33%;float:left;"]:nth-child(1), .footer div[style="width:33%;float:left;"]:nth-child(2) {  border-right: 1px solid #A9A2A2; height: 100px; margin: 0px; } Лучше прописывать в медиа правиле, кода шаблон под моб. девайсом.
...