Dillo
Handling Elements Out Of Flow

Introduction

This texts deals with both floats and positioned elements, which have in common that there is a distinction between generating block and containing block (we are here using the same notation as in the CSS 2 specification). Consider this snippet (regarding floats):

<ul>
  <li>Some text.</li>
  <li>
    <div style="float:right; width=50%">Some longer text, so
      that the effect described in this passage can be
      demonstrated.
    </div>
    Some more and longer text.</li>
  <li>Final text. Plus some more to demonstrate how text flows
    around the float on the right side.</li>
</ul>

which may be rendered like this

dw-floats-01.png

The float (the DIV section, yellow in the image) is defined ("generated") within the list item (blue), so, in CSS 2 terms, the list item is the generating block of the float. However, as the image shows, the float is not contained by the list item, but another block, several levels above (not shown here). In terms of dw, this means that the dw::Textblock representing the float cannot be a child of the dw::Textblock representing the generating block, the list item, since the allocation of a child widget must be within the allocation of the parent widget. Instead, to each dw::Textblock, another dw::Textblock is assigned as the containing box.

(Notice also that other text blocks must regard floats to calculate their borders, and so their size. In this example, the following list item (green) must consider the position of the float. This is discussed in detail in the next section.)

Implementation overview

Handling widgets out of flow is partly the task of class implementing dw::oof::OutOfFlowMgr, which is stored by dw::oof::OOFAwareWidget::outOfFlowMgr, but only for containing blocks. Generating blocks should refer to container->outOfFlowMgr[...].

Overview of the dw::oof::OutOfFlowMgr hierarchy;

dot_inline_dotgraph_5.png

Further details