Forum How do I...?

Float: column-top/column-top-cornver VS column-bottom/column-bottom-corner

Mike
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.

<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>

  1. puzzled.png125.0 kB
    float: bottom; not where I would expect
bobr666
I am seeing the same problem - is this still a problem or did you fix it?