Anyone actually watching.

 
Lodrigue: AimerPaddle, http://plnkr.co/edit/GdSvsH1I55fO0YoKcXnK?p=preview

Cordrey: Lodrigue: thank you so much!

Piepenburg: Swist: inset box-shadow

Schiaffino: So just to make sure I understand what you did… you set the column height to 100% and made it relative

Swist: Hapi, yeah i got that, but i’m having the hardest time replicating it exactly or close haha — trying to mimick it from illustrator and having a hard time.

Manring: Lodrigue: the translate part on the img is a little confusing to me

Greff: Swist, if you have photoshop cc, you can recreate there, and that able to copy the layer style as CSS property

Swist: Hapi, what about illustrator cc?

Swist: I have an .ai file and not sure how to bring the input from photoshop without flattening + rasterizing it

Hernon: Http://www.creativebloq.com/illustrator/extract-css-71412440

Witkowski: Any good workaround that would be similar to “overflow-x: visible; overflow-y: scroll”? in other words scrolling overlay that isn’t clipped to the container

Costales: Try it, i think you have good chance

Swist: Hapi, if this concept works i owe you a beer lmao

Seamons: Well, i got your word:

Athayde: Hi, I’m trying to crossfade while changing the src value of an img element Or something equivalent, changing the background doesn’t do it for me because the size of the element MUST be dependent of the size of the image, which is variable. Also, those are two SVG graphics, so layering is not an option as they are transparent.

Swist: Hapi, i tried it, but says background:#ffffff; or rgba255, 255, 255, 1 lol

Lodrigue: AimerPaddle, here is a siplified testcase: http://jsfiddle.net/q5pyu814/

Harklerode: Swist, then you try to reproduce in photoshop, im sure that able to export box-shadow as well

Volentine: Or, maybe will be easier with a generator like this http://www.cssmatic.com/box-shadow

Swist: Yeah i tried playing w the generator

Swist: It’s not easy to make 2 shadows in 1 or whichever

Swist: Oh well maybe i take a break and come back. it’s just a pesky shadow :

Esser: Lodrigue: so it just moves the element 50 percent of the container around it down and to the right?

Lodrigue: Note that, at the testcase the body is the position: reltive parent;

Lodrigue: AimerPaddle, this testcase is more representative: http://jsfiddle.net/q5pyu814/2/

Lodrigue: AimerPaddle, this is same layout with flex : http://jsfiddle.net/q5pyu814/3/

Lodrigue: But transform has better bowsercompatibility with vendor prefixes than flex

Lu: Lodrigue, the flex currently has better support 😀

Hemmeke: But both supported well on every major browser

Skrebes: Yeah i guess flex doesn’t have ie8

Pontremoli: Or ie9 and transform doesn’t have ie9

Baumgarter: Otherwise both support the rest of them

Niehaus: Http://caniuse.com/#search=flex

Kollen: Http://caniuse.com/#search=translate

Negreta: Hmm, shame z-index doesn’t override the overflow clipping mask

Heathershaw: Hapi: looks like we had the same idea haha

Broddy: Thanks for your help guys… much appreciated

Ciarletta: How would you make an a fill its parent

Sankaran: Other than width/height:100%

Ingraham: Width/height:inherit ?

Parone: Argh its still only the size of its inner contents

Timothy: Probably because a a defaults to display:inline and not display:inline-block

Mess: Ah, okay, display:block did it

Braaten: Http://jsfiddle.net/vg1hjycc/ . scrollable list with slide out rows, problem is that the items don’t actually slide out, they’re clipped to the parent; ideas?

Verjan: Anyone actually watching the channel?