Churchill: Jrajav: Yes, that’s what started to cause it. This page previously used tables but then recently switched to css columns.
Keas: Glaisher: Well the column count is 3, and the text appear to be larger than a third
Chandrasekara: Glaisher: Oh, one reason could be that break-inside: avoid-column doesn’t seem to be supported atm
Shurtliff: It’s supported on my browser but disabling that doesn’t fix it
Tetro: So the solution is probably to not apply the css column styles when there’s just one item.
Sharpnack: Diamonds tex-overflow?
Drier: Glaisher: Adding display: inline-block to the ul “fixes” it
Katzen: But it flows the text within one-third, its column
Bellanca: Dunno if that’s what you’re going for?
Rigano: Glaisher: Display: inline-block elements won’t be split between columns
Kratchman: Doing that also doesn’t fix it here
Jebb: Ropo, ? no, the “content” property
Steinhardt: Hello, is there a way to get the same effect as here but without making the entire row a clickable element? for example, making the photo + frame and the name below it a clickable link but nothing more than that
Sandersen: Looks like category viewer also which uses css columns doesn’t apply those styles when there’s one item so I think that’s what I’ll do.
Anctil: Or do i just have to accept using two copies of a link for this?
Therurer: How do I center an image that overflows a parent div?
Lowrie: L8D: does it overflow it _intentionally_?
Fahrenkrug: Lemondom_: Yeah, it overflows the parent. I want to set overflow: hidden on the parent, and have the child image centered within it
Kesley: Lemondom_: I know how to do that with background-image but is it possible to do that with an img?
Hewgley: I’m basically cropping the sides of the image
Artez: L8D: there are many ways: one would be to give the img element display: block; margin: auto;
Brookings: You are using the outer container as cropping tool?
Shira: Well, you can compensate by pushing the img itself using margin-left/margin-right or position: relative; left or right
Balboni: So half of crop width for centering it
Sharpnack: Merkazu ike this? — https://jsbin.com/cihomevuce/edit?html,css,output
Kafka: Lemondom_: my “outer container” would actually be the browser viewport in this case
Dari: L8D: ok, also doable, move the img element itself then
Helker: L8D: one thing though: it would be better for performance when the server side crops the image file before sending to client
Palm: Lemondom_: well I need the user to be able to expand the width dynamically. It’s not like the server can predict the width of the client
Hinger: L8D: maybe something lke SRCSET may be interesting for you?
Hutter: This might sound silly, but is #EFEFEF the equivalent of F0F0F0?
Dimariano: Is there a way to ensure the body element properly encapsulates the content for background purposes? tried: http://stackoverflow.com/questions/17555682/height-100-or-min-height-100-for-html-and-body-elements and it did not work
Savas: It appears that the html and body elements are stopping at 100vh despite being 100%
Naab: Merkazu: You mean you want the background image to cover the whole page at 100% height like this? Supposing you’re only covering with one image and not multiple images from time to time
Notwick: MrXXIV: nearly, but no
Pantaleon: MrXXIV: if you want to use values that are designed for humans, then use rgb or rgba, with 0%-100%
Gherardi: No, the background image itself fades to white at the top. i don’t want to mess with the aspect ratio of it
Hanavan: Rgb94%,94%,94% is straightforward to a human
Boque: Reisio: Oh I use rgba, but that was literally just a silly quick question 😀 I adore rgba http://mobame.com