Автоматический резиновый шеврон

Всё довольно просто: только CSS и HTML, хотя HTML в итоге получается ужасающим.

Смысл этого эксперимента вот в чём: в дропдаун, который показывается по клику на «ещё», автоматически помещаются все пункты, которые не поместились в одну строчку по ширине. При этом заранее неизвестно ни количество элементов, ни их ширина, ни ширина родителя — и всё это без JS.

Поизменяйте размер окна для демонстрации работы шеврона. Работоспособность проверялась только в современных !IE браузерах.

Думаю, не стоит особо объяснять почему такое, на самом деле, лучше делать при помощи яваскрипта, но данный пример, как и многие мои другие эксперименты, создавался, скорее, как proof of concept и исследование возможностей применения разных селекторов и их сочетаний.

Вы можете прокомментировать эту статью в Мастодоне.

Опубликовано 3 апреля 2011 г. с метками: #Experiment #CSS