Как я могу центрировать div между 2 плавающими divs

Question

привет У меня проблема с центрированием моего содержимого div между моими левыми и правыми боковыми панелями. Мои левые и направляющие боковые панели плавают, и нет float:center. Единственный способ, которым я могу сосредоточиться, - это использовать прописку, но это делает мой центр div под моими боковыми панелями.

Answer 1

Работает one.

margin: 0 auto; будет получать ваш элемент в центре внимания большую часть времени. (Быстрое примечание: ваш элемент должен иметь объявленную ширину для этого.)

margin: 0 auto; правило является сокращением для верхнего и нижнего полей и автоматического левого и правого полей. Автоматическое левое и правое поля работают вместе, чтобы вставить элемент в центр его контейнера.

margin: 0 auto; Настройка не работает идеально в каждой ситуации центровки, но она работает во многих из них.
ссылка: You Can't Float Center with CSS

HTML

<div class="leftsidebar">a</div> 
<div class="rightsidebar">b</div> 
<div class="content">c</div> 

CSS

.leftsidebar 
{ 
height: 608px; 
width: 60px; 
background:red; 
float:left; } 

.rightsidebar 
{ 
background:blue; 
height: 608px; 
width: 163px; 
float:right; 
} 

.content 
{ 
width: auto; //or any width that you want 
margin:0 auto; 
background:yellow; 
} 

Answer 2

сделать обертку вокруг всех 3 див, а затем расположить по центру DIV с запасом

<div id="wrap"> 
<div id="left" style="float: left"></div> 
<div id="content" stlye="float: left: margin: 0 auto;"></div> 
<div id="right" stlye="float: left"></div> 
</div> 

Answer 3

плавающой основой будет:

<div id="left"> Left</div> 
<div id="right" >right</div> 
<div id="middle">in between, but after</div> 

#left {float:left;width:XX;} 
#right {float:right;width:XX;} 
#middle {overflow:hidden; margin:0 XX;} 

Вы можете также посмотреть для других методов сохранения div в потоке [левый] [средний] [правый], например, используя: display: table/table-cell | встроенный блок | прогибается.

Answer 4

<div style="widht: 960px;"> 
    <div class="content left">left</div> 
    <div class="content center">center</div> 
     <div class="content right">right</div> 
     <div style="clear:both"></div> 
</div> 

здесь CSS

.content { 
float: left; 
} 

.left , .right{ 
width : 180px; 
margin : 0 10px; 
} 

.center{ 
widht: 540px; 
margin : 0 10px;