title: Why the boxes in an inline formating context was laid out vertically?
body: <p>Does the "div#wraper" create a BFC for its descendants?</p>
  
  <pre><code>&lt;div id="wraper"  style="overflow:visible"&gt;
      &lt;div&gt;&lt;/div&gt;
      &lt;div&gt;&lt;/div&gt;
  &lt;div&gt;
  </code></pre>
  
  <blockquote>
    <p>Floats, absolutely positioned elements, block containers (such as inline-blocks, table-cells, and table-captions) that are not block boxes, and block boxes with 'overflow' other than 'visible' (except when that value has been propagated to the viewport) establish new block formatting contexts for their contents.</p>
  </blockquote>
  
  <p>The 'overflow' of the "div#wraper" is 'visible', so it does not create a BFC but an inline formatting context. </p>
  
  <p>However, the descendants was laid out one after the other, vertically, which meets the rule of BFC. </p>
  
  <p>How to explain the contradiction, the boxes in an inline formating context was laid out vertically?</p>