Re: [css-page-floats] Re: [css-logical-properties] the 'inline-{start,end}' values for 'float' and 'clear' [css-page-floats]

>> But here is another possibility: float axis could be determined by property name, instead of value. Thus, 'float' would be longhand for 'float-x' ('float-inline' in horizontal writing), and eventually we could have 'float-v' ('float-block' in horizontal writing). That would allow us to keep start and end as values for all. 
>> This would be in line with logical equivalents of overflow-x and overflow-y, and could extend to background-position-x and background-position-y.
>> 
>> The full longhand for float would take two values, either logical or physical. So 'float: left' would really be the same as 'float: left none', 'float: top' would be the same as 'float: none top', 'float: start' would be the same as 'float: start none', and (maybe?) 'float: start top' would be the same as 'float-inline: start; float-y: top' (possibly causing float-y to override float-inline' in vertical writing?).
> 
> Have you looked at the parts about the float-reference in the page float spec [2]? 

I glanced before writing, and looked more closely after. 

> Initially it seemed logical that floats should float the same way in the block direction as they already float in the inline direction. But when looking further into it, it became apparent that the use cases of 'float: none top' would be rather limited,

'float: none top' should make it stretch all the way across the top,  which I think would be very common. This is assuming 'width: auto', and that shrink-to-fit width only occurs when there is horizontal floating. Floating already turns inline elements into display:block. 

> and also that the floating would have to happen in relation to some type of container in  order to make sense. 

Sure: The containing block, or nearest containing fragment of it. This was my intuitive expectation, even before reading the spec (or HÃ¥kon's earlier spec). 

Kind of like 'float-reference: column', if that were to also work with single-column parents. 

> The most common use case for floating in the block direction that if something floats to the top (in Latin text) it should cover the entire length of the line.

Right. So, 'float: none top'. 

> Other use cases may be that it floats into the upper right or upper left corner.

'float: right  top' or 'float: left top'

> Maybe several floats in the block direction will together fill the entire width of the container they are floating in relation to. But seldom/never does it seem to make sense to float to the block-start while keeping the inline position.

I see what you're saying, given a replaced element or something with a non-auto width. In that case, perhaps 'float: none [start | end | top | bottom]' should be as though the element is wrapped in an auto-width block box before floating. That would put it on the inline-start side, unless auto margins are used on one or two sides (or 'justify-self', etc.).  

> Or can you find a use case for this?

Centering across the top when width:auto and not replaced is the main one. 

> Btw, the current page float spec lacks the ability to do 2 dimensional floating. We probably want 2D floating eventually, but initially we wanted to keep it as simple as possible and get the float stacking right.

I think that would be hard to separate out and change later, because then you need to specify a direction in the single value. 

> Vivliostyle is currently working on an implementation, which likely will result in us finding issues with the current spec.

Experimental, right? I'm worried that you might convert a lot of content to doing it this way, and it would be hard to change to a better 2-value system later. 

> Also, I am still waiting for a list of issues/simplifications of the current spec that the Chrome team was/is working on.

OK. 

>> Snapping, as in the page floats draft [1], could be with a 'float-snap' property added to the longhand.

I meant "as a longhand", which could be included in the shorthand. And it would itself be a shorthand, taking one or two values. 

>> So, for example:
>> 
>> float-inline: start;
>> float-block: start;
>> float-snap-inline: 2em;
>> 
>> ...could also be written as this:
>> 
>> float: start start;
>> float-snap: 2em 0;
>> 
>> ...or:
>> 
>> float: start 2em start 0;
>> 
>> ...or just:
>> 
>> float: start 2em start;

Thoughts on this part?

>> 
>> 
>> 1) https://drafts.csswg.org/css-page-floats
> 
> [2] https://drafts.csswg.org/css-page-floats/#float-reference-property

Received on Wednesday, 4 November 2015 22:13:56 UTC