Централизованный div между двумя div, используя только CSS

Question

Я хотел бы знать, как мне центризировать один div, с неизвестным width только используя CSS.

Я хочу что-то вроде:

Использование <center> у меня есть:

<div style="float: left"> 
    <p:commandButton .../> 
</div> 
<center> 
    <p:commandButton ..."/> 
    <p:commandButton .../> 
</center> 
<div style="float: right"> 
    <p:commandButton .../> 
</div> 

Как что только с помощью css?

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

Answer 1

Это, кажется, задает много здесь, смотрите здесь How to horizontally center a <div> in another <div>?

По существу внутренний элемент, который вы желаете, чтобы центр требует типа отображения встраиваемого: блок; и контейнер, обертывающий этот элемент, который вы хотите центрировать в нем, устанавливает свойство text-align: center;

Answer 2

1) Установите text-align:center на родительский DIV (т.е. родителю элементов, которые вы упомянули)

2) Заменить center элемент с div и установить правило display:inline-block на нем.

FIDDLE

.parent { 
 
    text-align: center; 
 
} 
 
.middleBtns { 
 
    display: inline-block; 
 
}

<div class="parent"> 
 
    <div style="float: left"> 
 
    <button type="button"> 
 
     < </button> 
 
    </div> 
 
    <div class="middleBtns"> 
 
    <button type="button">btn1</button> 
 
    <button type="button">btn2</button> 
 
    </div> 
 
    <div style="float: right"> 
 
    <button type="button">></button> 
 
    </div> 
 
</div>