плавающий левый <li> с заданной шириной и проблемой переполнения

0

Извините за вопрос noob, но я нахожусь здесь уже несколько часов.

Я пытаюсь создать неупорядоченный список, который <li> плавает влево. и установлена ширина окна.

Проблема в том, что слишком много <li> он не будет добавлять прокрутку, вместо этого он поместит <li> который не поместится в другую строку

вот пример:

<ul id="someUL">
    <li> whatever </li>
    <li> whatever </li>
    <li> whatever </li>
</ul>

Ну на самом деле лучше показать на скрипке.

Вот пример того, что я имею в виду в http://jsfiddle.net/eSckg/1/

Мой вопрос, как мне это заняться?

Теги:

2 ответа

0

Попробуй это...

<style>
#someDIV{
    width:200px;  
    overflow-x:scroll;
    overflow-y:hidden;
    height:40px;
    padding:10px; 
}
#someUL{
    background:orange; 
    height:20px; 
    /* 3 li width=80*3=240px */
    width:240px;
}

#someUL li{ 
    list-style:none; 
    float:left; 
    background:white; 
    margin:0px 10px;
    width:60px;
    /* the width of each li is 60+10+10=80px */
}
</style>
<div id="someDIV">
<ul id="someUL">
    <li> whatever </li>
    <li> whatever </li>
    <li> whatever </li>
</ul>
</div>
0

Вам нужно увеличить ширину #someUL.

обновленная скрипка

Ещё вопросы

Сообщество Overcoder
Наверх
Меню