Горизонтальное меню из двустрочных элементов <li>

07-09-2015, 05:50 PM

Помогите пожалуйста с проблемой, над которой голову ломаю. Вот что нужно сделать:

Если таблицей делать то все легко:

HTML Code:

<td>
Записаться <br />
на тест-драйв
</td>

Но элементами <li> не получается, как только добавляю <br />, сразу все разваливается. Как зафиксировать ячейку подскажите пожалуйста нубу.

07-09-2015, 06:06 PM

@inso, http://htmlbook.ru/faq/kak-razmestit...a-gorizontalno

07-09-2015, 06:17 PM

Если не получится - пиши в скайп/личку. Результат тут выложу.

07-09-2015, 06:25 PM

@BTC, это я уже читал, но при использовании <br /> внутри <li> Меню разваливается

07-09-2015, 06:41 PM

@inso, http://html5book.ru/css3-text/

07-09-2015, 06:42 PM

Набросал на коленке

Code:

		<ul class="menu">
			<li><a href="">Меню</a></li>
			<li><a href="">Длинное название</a></li>
			<li><a href="">Еще длиннее название</a></li>
		</ul>

Code:

		ul.menu {
			padding: 0px; 
			margin: 0px;
			display: table;
		}
		ul.menu li {
			list-style: none; 
			display: table-cell; 
			border-right: 1px solid #000; 
			width: 70px; 
			word-wrap: break-word; 
			vertical-align: top; 
			text-align: center;
			margin-right: 3px;
		}
		ul.menu li:last-child {
			border-right: 0px; 
		}
		ul.menu li a {
			color: #000; 
			text-decoration: none; 
		}

Я так понял, что нужно сделать пункты меню фиксированной ширины.

07-10-2015, 11:41 AM

@Sven, спасибо, получилось

inso добавил 10.07.2015 в 10:41
@Sven, вот только старый ишак не понимает display:table

07-10-2015, 11:46 AM

@inso, За что минус, извините спросить?

07-10-2015, 12:03 PM

@BTC, извиняюсь, мимо плюсика промахнулся и не заметил)

07-10-2015, 12:13 PM

Quote:

Originally Posted by inso

старый ишак

Старый - это какой?