Re: [csswg-drafts] How to increase margins of containers for pending floats ? (#4052)

I need to make a "graphic" to present the problem because you don't
understand.

|<----------PAGE WIDTH------------------->|
|          :                     :        |
|< MARGIN >:<   CONTENT BOX     >:<MARGIN>|
|          : TEXT HERE...        :        |
|          +-------+ ...TEXT HERE:        |
|          | INNER +-------------|        |
|          | LEFT  |  INNER      |        |
|          | FLOAT |  CONTENT BOX|        |
|          +-------+             |        |
|          :       |             |        |
|          :       +-------------+        |
|          :                     :        |

Here I want to be able to size the new inner box according to the position
of the inner float. I don't want the inner content box to flow "around it"
(not even below it, it must remain to the right of it so that all left
floats will be in the left margin of the inner box, which remains
rectangular. Its width is then autojusted (reduced) as long as its
"min-width" is kept.
But if this is not the case, the inner box will "clear" vertically to go to
just below the float, and then will use the full width of the parent
content box:


|<----------PAGE WIDTH------------------->|
|          :                     :        |
|< MARGIN >:<   CONTENT BOX     >:<MARGIN>|
|          : TEXT HERE...        :        |
|          +-------+ ...TEXT HERE:        |
|          | INNER |             |        |
|          | LEFT  | cleared     |        |
|          | FLOAT |             |        |
|          +-------+-------------+        |
|          | INNER CONTENT BOX   |        |
|          +---------------------+        |
|          :                     :        |

This makes easy to insert floats any where before, and ensures that the
innerbox will never "wrap" around them (e.g. with their border or
background).
All I need is a way to specify that the inner box will not overlap any
float (left floats can continue flowing to the left as long they fit in the
left margin of the inner box). So I need a way to specify that the
left-margin inner box will never include any space used by the float, and
that the inner box will remain either completely to the right of left
float, or fully below it.
Visually, this creates the minimum "clear" space, and we don't have to
depend on the presence of absence of any prior float.
And the inner contenet box will still have a suitable minimum width, that
can be increased if needed to cover the whole width of the parent content
box. We don't need to size the inner content box, and we don't have to know
which margin to use (which would be useless if there are in fact no floats
before).

What I describe is just a way, a flag, to specify the left margin of the
inner box, in such a way that its margin will be increased (if possible) to
avoid the floats (but at the same time this would reduce the width of the
content-box for the inner box, that's why we need a "min-width" also for
the inner content box.

And simple way to specify it would be that the inner box would not just say
"margin-left:2em", but "margin-left:2em+0.5em", the "+" indicating that it
may be increased by the presence of prior left float (with ANY width). The
"0.5em" is optional: it allows setting an additional margin for the content
box, used only if there's a left-float, and that extra 0.5em will collapse
with the right margin of the float, the margin between both being the
higher value of the two
* so if the inner float has a "right-margin:0" the gap separating them
horizontally will be 0.5em = max(0, 0.5em)
* if the inner float has a "right-margin: 1em", the gap separating them
horizontally will be 1em = max(1em, 0.5em)
* Generally the floats have a small horizontal margin on their internal
side, and a 0 margin on their external side to align them with the parent's
content box.

As well for the "margin-right" with right floats.

Now floats can be present or absent, and can have any width if they are
present: the inner box will autoadapt its margin, but will clear
conditionally if their min-width cannot be satisfied.

We never have to reserve some arbitrary margin for the inner box when we
don't know if there will be floats before (and these floats may
appear/disappear: imagine that the float is vertically collapsible (like
the TOC in a wiki page if it has been placed in a left-float).

Le mar. 25 juin 2019 à 15:20, Oriol Brufau <notifications@github.com> a
écrit :

> None of the 10 proposed solutions are what I expect. All of them still
> leaves the float going "inside" the block (that they cover).
>
> This doesn't seem right, see
> https://www.w3.org/TR/CSS22/visuren.html#floats
>
> The border box of [...] an element in the normal flow that establishes a
> new block formatting context (such as an element with 'overflow' other than
> 'visible') must not overlap the margin box of any floats in the same block
> formatting context as the element itself.
>
> So please clarify why "The block formatting context does not help here".
> An example with code would be useful.
>
> —
> You are receiving this because you authored the thread.
> Reply to this email directly, view it on GitHub
> <https://github.com/w3c/csswg-drafts/issues/4052?email_source=notifications&email_token=AAKSUGYSR5F6B6FJ332IXQLP4ILQTA5CNFSM4H2XO7AKYY3PNVWWK3TUL52HS4DFVREXG43VMVBW63LNMVXHJKTDN5WW2ZLOORPWSZGODYQGWWA#issuecomment-505441112>,
> or mute the thread
> <https://github.com/notifications/unsubscribe-auth/AAKSUG5VQD2YCXS7EWNESBLP4ILQTANCNFSM4H2XO7AA>
> .
>


-- 
GitHub Notification of comment by verdy-p
Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/4052#issuecomment-506558703 using your GitHub account

Received on Friday, 28 June 2019 00:38:02 UTC