Почему это возможно? t плавающие элементы устанавливают свои левое и правое поля

В div-оболочке плавающие элементы не реагируют на настройки левого и правого полей. Пример:

html:

<div id ="wrapper">
    <div id = "content"></div>
</div>

css:

#wrapper
{
   width:       1000px; 
   display:         block;
   margin-left:         auto;
   margin-right:    auto;
   overflow:            hidden;
}

#content
{
   width:               400px;
   height:              200px;
   display:             block;
   float:               left;
   margin-left:         30px;
}

#content игнорирует настройку левого поля. Почему?