Live data from Hacker News

Show HN: Layoutit – An interactive CSS Grid generator

layoutit.com

51–60 of 75 posts

Re: Show HN: Layoutit – An interactive CSS Grid generator

#51

This is super cool! Only sort of related, I wonder how long they stared at that name and that it had `tit` in it before they decided to go all lowercase because they thought it was funny. I can't imagine that discussion didn't happen while planning to launch this. What's weird is that my eye sees the word `tit` before the rest of the context. I'm not a weird pervert or anything as far as I know. It actually does cut…

What about expertsexchange.com .. what do you see there ;o)

Re: Show HN: Layoutit – An interactive CSS Grid generator

#52

Very nice - I feel like I just learned CSS Grid in like 2 seconds. Also learned about fr units: https://alligator.io/css/css-grid-layout-fr-unit/

nah, this doesn't really let you do much with css grid and you don't really get to learn the power of it. If you want to learn it pretty quickly, try this...

https://learn.freecodecamp.org/responsive-web-design/css-gri...

Re: Show HN: Layoutit – An interactive CSS Grid generator

#53

Earlier quoted context omitted.

(1) In cases where you want good browser support. (2) This is going to sound stupid...but if you don't have a grid. Flexbox is a more flexible tool in this more flexible case.

I actually think CSS Grid solves your #2. A lot of people who don't use grids were probably overwhelmed by all the grid libraries out there and the complexity and overhead of them. I made my own grids, if you could call them that, and then Flexbox showed up and everything became amazing and easier. Then CSS Grid showed up and said "You think Flexbox makes amazingly easy responsive layouts? Hold my beer."

I might be a grid-noob, but let's take a super-duper common situation:

I want to left align one element and right align another, keeping them in the same row.

Flex makes this very easy:

    
      Left
      Right
    
Does grid also make this easy?

Re: Show HN: Layoutit – An interactive CSS Grid generator

#54

This is super cool! Only sort of related, I wonder how long they stared at that name and that it had `tit` in it before they decided to go all lowercase because they thought it was funny. I can't imagine that discussion didn't happen while planning to launch this. What's weird is that my eye sees the word `tit` before the rest of the context. I'm not a weird pervert or anything as far as I know. It actually does cut…

Maybe they should just go full hog and make this their mascot: https://en.wikipedia.org/wiki/Tit_(bird)

Re: Show HN: Layoutit – An interactive CSS Grid generator

#59
post #49
post #24

Earlier quoted context omitted.

Browser support as well. Grid is only about https://caniuse.com/#feat=css-grid

I remember a video + blog post about this, and it was suggested to just ship a mobile layout for browsers that don't support css grid. At least for personal sites that seemed reasonable. EDIT: https://m.youtube.com/watch?v=txZq7Laz7_4

Thanks for this :)

Re: Show HN: Layoutit – An interactive CSS Grid generator

#60

It's really slow, especially when you get to 40x40-ish. Does something like this need to be that slow? I'm curious if there are more optimized solutions.

I'm curious to know what sort of website layout requires a 40 x 40 grid.
Post reply on HN