Wishes for CSS

William F. Hammond

June 12, 2014

Baseline designations in flexible boxes

1. It would be good to be able to designate for an inline flexible box where the baseline should be as an offset, relative to the cross-axis of the box, from either the cross-start or the cross-end.

2. It would be good to be able to designate for an inline flexible box item where, relative to either end of its cross axis, the cross-axis should meet the baseline of its parent.

Reverse Parent/Child Selectors

Currently the selector “A > B” is used for properties of “B”, the child, when “A” is its parent. Sometimes it would be useful to have a selector for properties of the parent. That is, “B < A” would be a selector for properties of an element “A” when it has a “B” child, and, for example, “B:nth-child(2) < A” would be a selector for properties of “A” when it has a “B” second child.

Note: In an editor's draft currently at W3C, the functionality of “B < A” is covered by the proposal for “A:has(> B)”.

More Options for Border Sides

At the very least more border properties would be useful for styling math. The relatively new border-radius property with border-left and border-right is useful for the side borders of matrices. Further border-side properties might provide small corners (stretchy brackets) or a pinch in the middle (stretchy braces). Another border property extension, perhaps

border-left-decoration: math-radical; ,

could provide a way to have the left-side border decoration for a mathematical square root.

Uni-tables

The term uni-table is intended to indicate a table having either a single row or a single column. The idea is that the content is tabular data. The children of an element with display type uni-table, with uni-direction either row or column, would be called uni-cells. A uni-cell would, in a sense, serve the dual role of both table-row and table-cell. The borders between cells should all have the same length, regardless of the value of border-collapse.

Border Merging

Elements whose boxes are either horizontally or vertically contiguous might be caused to share a border decoration of the same type that would be the union of the two borders. For example,

border-merge: merge separate separate merge;

might be used to indicate the availability of the border segments of an element for merging. Note that for a table cell “border-merge: merge;” would have the same effect on the cell as “border-collapse: collaspe;” for its table ancestor.

Flexible Box Tabular Alignment Markers

In a flexible box it would be good to be able to specify alignment markers along the principal axis of the box using a property of a flexible box item. This might be, for example, a property called tab-mark having possible values representing offsets from either end of the flexible box item such as tab-mark: first-end(-1.5em); or tab-mark: last-end(+8%);, where a percentage spec would be relative to the length of the flexible box item along the principal axis.

The purpose is to provide dynamically-determined alignment points along the main axis of the flexible box for the content in different lines within the box. For the different lines the items with tab-marks should align based on sequential positions within their lines or else, perhaps, with many marks, based on some system for the matching of keys with id values. While, with some annoyance, this effect could be achieved with table constructions, provision for alignment markers would be intended to cover other cases where alignment is desired but the content is inherently not tabular in nature such as, for example, a playscript (with left-to-right text) in a two column (abstractly, for the flexible box, two lines) flexible box layout, with one column for the dialogue and the other for stage directions.