• 201505 May

    The CSS Working Group has reached an impasse on the issue of percentage margins (and padding) in flex and grid layout, and needs your input to help decide it.

    Option 1: Flex and grid items resolve percentages in margin-top and margin-bottom against the height of the element’s containing block.

    Option 2: Flex and grid items resolve percentages in margin-top and margin-bottom against the width of the element’s containing block.

    Option 1 makes vertical margins consistent with horizontal margins (which resolve percentages against the width of the element’s containing block). This is a theoretically simpler model, and works well with Flexbox and Grid’s dimension-agnostic layout concepts. However, it is inconsistent with CSS block layout, and causes the margins to collapse to zero when used in an auto-height container.

    Option 2 is consistent with the behavior of vertical margins in block and table layout. It has usable behavior in auto-height boxes, and enables the “aspect ratio hack”. However, it is a less obvious behavior, and means the layout interactions change based on whether a flexbox is “row” or “column”.

    (For more background, see discussion on www-style.)

    We’re looking for comments from authors explaining which behavior they think is better for Flex and Grid layout, and why. Do you have use-cases that can only be achieved with one behavior or the other? Show us!

  • 201419 Dec

    The CSSWG has published an updated Working Draft of CSS Box Alignment Level 3. This module extends the Flexbox alignment properties to apply to all layout models and adds additional controls for logical positioning, space distribution, and handling overflowing elements.

    This is the vertical centering module, people.

    This module’s syntax and functionality is in the process of stabilizing now and we need your feedback. Think of all the cool things you could do with the new alignment properties! Imagine them! Examine them! Make examples! Write rants! And tell us what is awesome and what is stupid so that we can fix it to be better before it gets locked down in shipped browsers.

    Changes since the last Working Draft are listed in the Changes section.

    Please send feedback! Comment here, post to the (archived) public mailing list [email protected] with the spec code ([css-align]) and your comment topic in the subject line, write a blog post and send us a link, or, if you’re shy, email one of the editors directly. Ranting somewhere else in the ether and expecting us to find it by magic, however, won’t work.

  • 201110 Nov

    This is cross-posted from the CSSWG Blog.

    At the CSSWG F2F last week, I raised the issue that the radial gradients we were discussing were unreadable to me, and probably therefore to much of the intended audience. It was not at all obvious by looking at the gradient syntax what the various numbers and lengths might be.

    radial-gradient(60% 43%, 25px 25px, #b03 99%, transparent)

    So Tab Atkins, David Baron, Brad Kemper, Brian Manthos and I hashed out an alternative syntax.

    radial-gradient(circle to 25px at 60% 43%, #b03 99%, transparent)

    We’d like your opinion on which is preferred and why.

Page 1 of 6:

Hosting by: