- From: David Hyatt <hyatt@apple.com>
- Date: Fri, 10 Mar 2017 17:36:18 -0600
- To: Florian Rivoal <florian@rivoal.net>
- Cc: Jen Simmons <jensimmons@mozilla.com>, W3C www-style mailing list <www-style@w3.org>
It looks like content is no longer supposed to be clipped in the latest multicolumn draft (section 8.1 has changed). In older versions of the spec, column content was supposed to be clipped halfway into the column gap. I’ve changed WebKit to stop clipping interior columns like this and to allow the contents to overflow in the inline direction, and the list markers show up fine now. dave > On Mar 9, 2017, at 12:20 AM, Florian Rivoal <florian@rivoal.net> wrote: > > >> On Mar 9, 2017, at 09:54, Dael Jackson <daelcss@gmail.com> wrote: >> >> <jensimmons> btw there’s a very annoying bug in multicolumn that I >> was running into again yesterday. Here’s a demo. >> http://codepen.io/jensimmons/pen/QpdyMr The list >> styling is missing from any column but the first one >> in Safari and Chrome. Likely an old webkit bug (from >> before the fork). It would be good to fix this. > > This isn't so much as a layout engine bug as a very annoying side effect of the way the default UA stylesheet for lists is written: > > ol and ul have "padding-left: 40px;" in the UA stylesheet (or rather 'padding-start: 40px', with logical properties), and it is in that 40px area that the list counters and bullets get shown, since they are off to the left (start) of the list items' boxes. This already is terrible when you use a very large font size, as your bullets/counters may end up overflowing the list, but gigantic font sizes are rare enough that it doesn't happen all that often. > > The problem with multicol is that when you turn an ol or an ul into a multicol, the padding is applied to the multicolumn as a whole, not to each individual column box, So effectively, the first column gets it, and the other columns do not. So, since there isn't a 40px space to show the list item markers, they overflow the column box, and get clipped. If you put your ul / ol in a div / article / section / ... and turn that into a multicol, the "bug" goes away. > > It is still terrible, as you do not always have a wrapper element, and CSS should be sane and robust. > > The right way to do it is to use a 40px (or even better 2.5em) margin on the li instead of a padding on the ul/ol, and authors can do just that. But as far as I know, we cannot fix the default style, as too much of the web depends on it. > > Maybe someone smarter can think of a way of fixing this issue without breaking the web. > > —Florian
Received on Friday, 10 March 2017 23:36:57 UTC