Hi all,
Please see the attached file to understand why I'm puzzled...
float: column-top; floats block element to left-top;
float: column-top-corner; floats block element to right-top;
float: column-bottom; floats to right-bottom;
float: column-bottom-corner; floats elements the same way as column-bottom.
Is there something I'm missing about how these floats should work OR doing something wrong?
I would expect float: bottom to be left-hand floated.
Please see the attached file to understand why I'm puzzled...
float: column-top; floats block element to left-top;
float: column-top-corner; floats block element to right-top;
float: column-bottom; floats to right-bottom;
float: column-bottom-corner; floats elements the same way as column-bottom.
Is there something I'm missing about how these floats should work OR doing something wrong?
I would expect float: bottom to be left-hand floated.
<html>
<body>
<div style="columns: 3; column-rule: solid thin">
<div style="float: column-top; column-span: 1; border: solid red thin">
top
</div>
<div style="float: column-top-corner; column-span: 1; border: solid red thin">
top corner
</div>
<div style="float: column-bottom-corner; column-span: 1; border: solid red thin">
bottom corner
</div>
<div style="float: column-bottom; column-span: 1; border: solid red thin">
bottom
</div>
Some text goes here.<br/>
Some text goes here.<br/>
Some text goes here.<br/>
[much more text to make full page]
</div>
</body>
</html>