是这样的

<div class="container">

    <div class="floating">
      
      <img src="image" alt="">
      
      <p>
          text...
      </p>
      
    </div>
    
    <div class="floating">
      
      <img src="image" alt="">
      
      <p>
          text...
      </p>

    </div>
    
</div>

我希望"浮动"的div浮动在对方的左侧，即使他们正在溢出他们的容器。
我试着在浮动的div上使用"float：left"，但是不起作用，它们互相堆叠。
所以，我找到了一个变通方法，在浮动元素上使用"display：inline-block"，在容器上使用"white-space：nowrap"，它可以工作，但对我的情况没有帮助。

.container{
    width:600px; 
    border:2px solid black;
    overflow:hidden;
    display:block;
    white-space:nowrap; /* delete this and see the actual floating divs layout*/
}

.floating{
    width:66%;
    display: inline-block;
}

img{
  width:120px; 
  height:120px;
  float:left;
}

事实上，"whit-space：nowrap"阻止了我的文本在浮动div中环绕imgs，这是最初的意图。"whit-space：nowrap"做了它应该做的事情，所以这个技巧似乎只有在一个人不关心将内容环绕在div中时才起作用。
总而言之，如果我保留了空格属性，我的两个div会像它们应该的那样浮动，但是它们里面的内容会被弄乱;如果我不使用这个属性，div里面的内容会被保留，但是它们不会浮动。
https://jsfiddle.net/8n0um9kz/
有什么办法能让我得到我想要的吗？
谢谢。
PS：我在例子中使用了66%的宽度作为浮动div，这样你就可以同时看到它们，当然，在我的例子中，它们是100%的。