Место ul в левом нижнем углу

Каков наилучший способ разместить ul в левом нижнем углу div?Место ul в левом нижнем углу

Это самое близкое, что я мог бы придумать, используя ul. http://jsfiddle.net/dan_cron/jUef2/

Если я избавлюсь от ul и использую div вместо этого, я могу это сделать. http://jsfiddle.net/dan_cron/jUef2/0/

Почему уль ведут себя иначе, чем DIV?
Могу ли я переместить ul только css?
Есть ли лучший способ разместить панель навигации в нижнем левом углу div?

HTML

<div class="big"> 
    <ul class="middle_left"> 
     <li>Small left</li> 
    </ul> 
    <div class="middle_right"> 
     Big right 
    </div> 
</div>

CSS

.big { 
    overflow: auto; 
    position: relative; 
    border: 1px solid; 
} 
.middle_left { 
    border: 1px solid; 
    position: absolute; 
    bottom: 0px; 
} 
.middle_right { 
    float: right; 
    border: 1px solid; 
    line-height: 48px;  
}

источник

2013-07-03 Dan Cron

Если добавить "поле: 0px" к вашему UL, то он должен работать.

источник

2013-07-03 16:18:37 bentedder

Это сработало. Спасибо огромное! –

Нет проблем. Не стесняйтесь отмечать как «ответил» :). – bentedder

Причина, по которой ul работает по-разному от div, связана с таблицей стилей по умолчанию, предоставляемой браузером.

Вот краткая статья, описывающая таблицы стилей по умолчанию. http://www.lifeathighroad.com/web-development/understanding-a-browsers-default-css/

Ниже приведена определенная информация о различных настройках браузера. http://css-class.com/test/css/defaults/UA-style-sheet-defaults.htm

Рассматривая диаграмму, в большинстве случаев браузер предоставляет по умолчанию по умолчанию 1em сверху и снизу ul. В то время как у div нет значения по умолчанию, поэтому поле по умолчанию для div равно 0.

Ответ от bentedder решает проблему, переопределяя по умолчанию маркер браузера для ul.

В Firebug по умолчанию просмотр стилей CSS по умолчанию браузера отключен. Чтобы включить его, в Firebug, на вкладке HTML, на вкладке «Стиль» выберите «Показать пользовательский агент CSS».

источник

2013-07-05 14:58:37

Место ul в левом нижнем углу

ответ

Смежные вопросы