10 modern layouts in 1 line of CSS

21 mins of awesome content and quick refresher for someone out there looking to prepare for interviews, but would suggest remove click bait "1 line" from description

Thank you soooooooooo much!!

WOW!!!

😲😲😲😲😲😲😲😲 At last someone who take care about presentation, thank so much for your explanation, whatever I am a spanish speaker, however I got these CSS tricky very clearly, congratulations for your creativily exposition

Really good vid thanks ❤

Thanks that is helpful 😊

your source code of this video not get please provide it again on same link

Amazingly practical and useful tutorial. Wish I'd seen it earlier :)

Gracias !!

imagine trying to tell a chick how you feel about her with 1 line of css lol..

dunno about you fellas, but I'm all 'position: absolute;' lol

gotta talk dirty css with girls. they love it. 😀

Bring your G game when it comes to CSS and flirting with chicks. ALWAYS.

On my Imac I have an issue where all the content stretches all the way across the screen. Not sure ho to resolve this as I used grid.

thanks for sharing this.

what is the app used i really like it how its side by side like that

Raf res Gon

Fati fa

Vaz han

Cast

Medio dique

Tris prior purga forense

Ton han dar Fer Inter

Frutd

Jon han teran surf

thanks!

my life was saved, I stopped suffering! thanks!

grid-template-columns: repeat(auto-fit, minmax(250px, 1fr));

doesnt work for me

Highly recommend putting a de-esser on the audio track for these videos. It sounds a little harsh

My customers refuse to stop using IE :)

this is lit !!! someone pay this girl ;)

Just FYI, clamp() and aspect-ratio are both compatible with all browsers now (except for internet explorer rip)

Great info - thanks! And also, big thanks for your wonderful energy!

These aren't single lines.

What a video!!

grid-column: 1/12; etc. is not working for me. Do I need to set up the row width somewhere ? Thanks.

didnt know the repeat function, will use it now

I can read also.. Ugh, what a waste of time. just get to the point, and how about you stop reading and just talk about what you know??

Thanks a lot

Yeah !! so cool !

MOOOOOREEE! This was such a useful video packed with good information and even better explanations!

aspec-ratio: 1 is used in css battles a lot, instead of writing width: 100px height: 100px; and having to update both all the time simultaneously

Months ( years? ) after visionning this video, that place-items : center finally saved me in a big company project :) . Transform translate (-50%,-50%) often makes content blurry because of antialiasing and other stuffs I guess so this simple css property is way more cleaner and finally feels like "the right thing to do" ! Thanks a lot

Great tutorial!
Rrally informative and at a very nice pace

Thanks, girl, I will study these neat CodeSS!

nice video

Good morning my account and I will be in which case ☺️ to get the company and I have been working on

awesome that's it now i learned modern layout system

Impressive! ❤

thank

The ideal width for a paragraph, according to studies run on social media websites, is between 40 and 55 characters per line.

Obviously those numbers may vary slightly depending on the font used, but they should work as a good starting point for the width of a content container.

width: clamp(40ch, 50%, 55ch);

Can you have place-self : cantered?

Because if you are displaying popovers (we put them all in a position:fixed element which is at the top level), then centering them has to be done by the old top:50%:left:50%;transform: translate(-50%, -50%) thing if you ever plan to have more than one. (Our app does)

thx, great video.