Сделать элементы списка одной высоты в пределах каждой строки

Внимание, важное сообщение: Дорогие Друзья!
В ноябре далекого 2001 года мы решили создать сайт и форум, которые смогут помочь как начинающим, так и продвинутым пользователям разобраться в операционных системах. В 2004-2006г наш проект был одним из самых крупных ИТ ресурсов в рунете, на пике нас посещало более 300 000 человек в день! Наша документация по службам Windows и автоматической установке помогла огромному количеству пользователей и сисадминов. Мы с уверенностью можем сказать, что внесли большой вклад в развитие ИТ сообщества рунета.

Но... время меняются, приоритеты тоже. И, к сожалению, пришло время сказать До встречи! После долгих дискуссий было принято решение закрыть наш проект. 1 августа форум переводится в режим Только чтение, а в начале сентября мы переведем рубильник в положение Выключен

Огромное спасибо за эти 24 года, это было незабываемое приключение. Сказать спасибо и поделиться своей историей можно в данной теме.

С уважением, ваш призрачный админ, BigMac...

Сделать элементы списка одной высоты в пределах каждой строки

Мамелюк

Новый участник

Сообщения: 43
Благодарности: 0

Профиль | Отправить PM | Цитировать

Изменения

Автор: Мамелюк
Дата: 25-11-2015

Добрый день!
Есть такая страница

HTML код:

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title></title>
		<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>
		<style type="text/css">
			body{font-size:16px}
			#wrap{max-width:400px;text-align:center;border:2px solid red}
			.list li{display:inline-block;vertical-align:bottom;width:100px;text-align:left;}
			.list li a{display:block;margin:5px;border:1px solid green}
		</style>
	</head>
	<body>
		<div id="wrap">
		`	<ul class="list">
				<li><a href="#">111111 111111 1 1 1 1</a></li>
				<li><a href="#">22 2222 2 2 2</a></li>
				<li><a href="#">333 3 3 3 3 33 3 3 33333 3 3 3 3 3 3 3 3 3</a></li>
				<li><a href="#">4444444444 4444444 444 4 4 4444444444 4 44 4 4 44</a></li>
				<li><a href="#">5555 555</a></li>
				<li><a href="#">66 6666  6666  6 6 6 666 66 66 6 6 6 6  6 6 66666 66666 666 6</a></li>
				<li><a href="#">7777 7777777 7777 777777 777</a></li>
			</ul>
		</div>
	</body>
</html>

По условию на странице нельзя использовать таблицы html, display:table, и float (это важно!).

Как кроссбраузерно (IE6 и 7 не нужны) с помощью чистого JS или Jquery (Jquery предпочтительней, тк библиотека подключена) сделать так, чтобы высота элементов списка подгонялась под высоту самого высоко в строке.

Я знаю, как сделать все элементы списка одной высоты, выровняв их по самому высокому в списке. Но мне надо, чтобы это работало отдельно для каждой строки. Количество строк может быть любым, ширина #wrap тоже любым, как и количество элементов в строке. Например, в данном примере, при увеличении масштаба страницы, #wrap начнет сужаться, а количество элементов в строке уменьшится с 3 до 2. Соответственно после этого и самый высокий элемент в строке может смениться.

Друзья, заранее спасибо!

Отправлено: 19:17, 25-11-2015