Авто высота ячеек маркированного списка

Эта наработка, точнее небольшой скрипт, очень спорный в практическом применение т.к. то, что он делает можно добиться без всяких скриптов, воспользовавшись просто старыми добрыми таблицами! Но если Вы ярый приверженец блочной верстки и не терпите таблиц или просто напросто заказчик просил их не использовать, этот пост для Вас и скорее всего он поможет новичкам!

Как мы знаем, чтобы построить допустим анонсы статей в шапке, пример:

Очень удобно использовать конструкцию маркированного списка:

<ul>
	<li>...</li>
	<li>...</li>
	<li>...</li>
</ul>

Но этот список иногда себя не очень удобно для нас ведет, ведь если мы располагаем ячейки горизонтально с помощью float:left, то каждая ячейка принимает ту высоту, которую определит ей контент внутри неё. Выглядит так:

Так вот если нам нужно, чтобы все ячейки равнялись на высоту самой большой ячейки, я нашел 2 метода:
Метод №1
Через CSS, без JS

ul{
overflow: hidden;
}
li{
float:left;
width:200px;
padding-bottom:10000px;
margin-bottom:-10000px;
}

Этот метод хорош тем, что он легкий и понятный даже новичку. Но если стоит задача со сложным оформление такого списка, тогда этот список никак не подойдет, ведь у него нету «дна», нижняя граница таких ячеек находится далеко внизу страницы из-за огромных padding’ов. В той работе, из-за который я начинал поиски решения подобной задачи, меня вполне устроил этот метод, т.к. сложного оформления не было и «низы» ячеек и в общем списка, были не задействованы. Но мне было интересно избавиться от «минусов» первого метода(это совпало с желанием изучать JS) и так я дошел до метода 2.
Метод №2
Изпользует JavaScript

//Начало скрипта
window.onload = function() {
function getClass(name,type) { // ф-ция выборки списка по его классу
var r = [];
var re = new RegExp("(^| )" + name + "( |$)");
var e = document.getElementsByTagName(type || "*");
for ( var i = 0, len = e.length; i < len; i++ )
if ( re.test(e[i].className) ) r.push( e[i] );
return r;
}
var elementul = getClass("autoh", "ul"); // выбираем список с определенным классом(в данном случае "autoh")
var h = elementul[0].offsetHeight; //замеряем высоту большей ячейки в списке
var elementli = elementul[0].getElementsByTagName('LI'); // отбираем в массив элементы списка
for(var i=0; i<elementli.length; i++) { // в цикле присваиваем каждому элементы новую высоту
elementul[0].getElementsByTagName('LI')[i].style.height = h + "px";
}
}
//Конец скрипта

Ну кто знаком с JS поймут как работает скрипт, единственное я позаимствовал функцию выборки элементов DOM по классу, на мой взгляд очень удобно, просто прописал списку класс и все работает!
Использование скрипта:

1. Копируем код, подцепляем его к страницы, на которой заветный список
2. Присваиваем списку класс «autoh» из моего примеры, можно использовать свой класс, только не забыть исправить этот класс и в скрипте

И получается такая картина: