Stacking Divs бок о бок в CSS

Question

Я не хотел прибегать к просьбе здесь, но после нескольких часов разочарования я чувствую, что должен!

У меня есть два (может быть больше) divs, которые я хочу бок о бок. Их родительский div имеет фиксированную ширину и overflow:hidden, поэтому мы можем видеть не более одного div за раз. Проблема заключается в том, что они не будут складываться бок о бок! Я пробовал float:left и display:inline безрезультатно.

есть JSFiddle пример, который я сделал here

Любая помощь будет высоко ценится!

Answer 1

Вам нужно иметь Div

#tab_container{ 
    width:2000px; 
} 

Который затем дает свои поплавки достаточно места держаться на плаву бок о бок, в настоящее время у них недостаточно места, и по умолчанию поведение поплавка заставляет их перейти к следующей строке.

http://jsfiddle.net/QBhmF/10/

Answer 2

У вас был взгляд, например. здесь: How to float 3 divs side by side using CSS

Answer 3

Try дисплей: встроенный блок

Answer 4

шаблонное решение этого Иофф верхней части моей головы) может быть следующим:

<div class = 'container'> 

<div class = 'floater'>Some text</div> 
<div class = 'floater'>Some other text</div> 

<div class = 'clearout'></div> 

</div> 

div.container { 

width: 400px; 
border: 1px solid blue; 

} 

div.floater { 

float: left; 
width: 48%; 
border: 1px solid red; 
margin: 2px; 

} 

div.clearout { 

clear: both; 
height: 0px; 
visibility: hidden; 
width: 100%; 

} 

Всех полей применительно к плавающим могу испортить расположение. Плавающие могут также иметь абсолютные размеры, а не проценты, если вы можете предсказать их размер.

НТН,

G

Answer 5

Каждый из них дивы потребности display:inline-block и родитель должен: white-space:nowrap поэтому они остаются все в одной строке.

Пример:

http://jsfiddle.net/QBhmF/15/

Answer 6

попробовать

положение: относительная поплавок: левый