Как выровнять внутренний DIV в центре внешнего DIV

Question

У меня есть нижняя панель инструментов, как это:

<div style="float:left;width:100%;position:fixed;z-index:210;bottom:5px;">

    <div style="float:left;width:928px;border:1px solid #000;background:url('/images/noise-bg.jpg') repeat-x;height:26px;padding:5px;">
         Toolbar Content
     <div>

</div>

Но эта панель инструментов выровнена по левой стороне страницы. Я хочу, чтобы этот DIV был в центре страницы. Означает одинаковое пространство на обеих сторонах (слева и справа) панели инструментов. Я не могу исправить ширину панели инструментов, это всегда 100%. Я попытался установить фиксированный margin-left, но он отличается в разных браузерах / разрешениях и iPad. Есть идеи?

Спасибо

Answer 1

Ваш div имеет width:100% и float:left, поэтому он будет иметь такой же размер, как ваша страница, и вы не сможете центрироваться.

Установите правильную ширину, удалите это значение и применитеправило margin: 0 auto вашего div для центрирования.

Я сделал jsbin, чтобы показать, что работает:

http://jsbin.com/obepad/2/edit

Answer 2

См. Мою рабочую демонстрацию на jsfiddle

главное, чтобы вы удалили float: left; от второго div и добавить поле: 0 авто ;. Если вы не можете сделать это, пожалуйста, дайте мне знать

Answer 3

Отредактировано на основе вашего отредактированного вопроса:

Удалите float: left и добавьте margin: 0 auto для выравнивания рамки.выравнивание текста: центр будет выравнивать текст.Вы можете проверить это здесь: http://jsfiddle.net/wFZNv/

Это код:

<div style="float:left;width:100%;position:fixed;z-index:210;bottom:5px;">
<div style="width:928px;border:1px solid #000;background:url('/images/noise-bg.jpg') repeat-x;height:26px;padding:5px;-webkit-border-radius: 3px;-moz-border-radius: 3px;border-radius: 3px; text-align: center; margin: 0 auto;">
     Content
 <div>

Answer 4

Для вашего сценария попробуйте:

<div style="width:100%;position:fixed;z-index:210;margin: 0 auto;">

Answer 5

Удалить поплавок для внутреннего дел. Независимо от того, как вы разместите свой div, float: left вставит левое поле. используйте поле: auto для центрирования вашего внутреннего div