- From: Amelia Bellamy-Royds via GitHub <sysbot+gh@w3.org>
- Date: Sat, 18 Apr 2020 02:14:06 +0000
- To: public-css-archive@w3.org
If I understand correctly, you're looking for something like the [box alignment properties](https://drafts.csswg.org/css-align-3/), which are still not fully supported for regular paragraph text, but which would give a lot of control over how content is aligned within a container. You can almost get what you want with ``` display: grid; align-content: unsafe end; ``` The grid on the paragraph is there to force it to treat the child text content as a separate layout block and to increase support for the `align-content` option. The `align-content: end` says to align the child content to the bottom of the container. `unsafe` says to do so even if it overflows at the top. But that fits the end of the _full height_ of the text line to the bottom of the container, including “descenders” on the letters. I can't think of a way to get the baseline to align exactly with the border bottom. [](http://software.hixie.ch/utilities/js/live-dom-viewer/?%3C!DOCTYPE%20html%3E%0A%3Cp%20style%3D%22border%3A%201px%20solid%3B%20height%3A%204px%3B%20line-height%3A%200%3B%20padding-top%3A%204px%22%3EText%3C%2Fp%3E) Could you give a larger example of a design that needs this type of overflow & alignment? Why is the paragraph constrained to a shorter height than the text? Why is the overflow needed at the top? How should it behave if there are multiple lines of text? Without knowing those things, we cannot discuss a general solution. -- GitHub Notification of comment by AmeliaBR Please view or discuss this issue at https://github.com/w3c/csswg-drafts/issues/4582#issuecomment-615539685 using your GitHub account
Received on Saturday, 18 April 2020 02:14:09 UTC