Hacker News Reader

Comment by sotojuan | Hacker News Reader

I see a lot of these "CSS frameworks" pop up, but which ones do people actually use day to day?

Not criticizing the author—this looks cool and I'll give it a try, but I see a lot of these pop up and at work I've only ever used Bootstrap/Material/Semantic UI and for my own work I use Tachyons. Anyone use something a bit more obscure?

View on HN

I use http://tachyons.io/ for everything and couldn't be happier. It gives you lots of singe-purpose classes that you mix and match.

And most importantly it gives you a REM-relative scale for your spaces: http://tachyons.io/docs/layout/spacing/ and for typography: http://tachyons.io/docs/typography/scale/.

So everything is responsive and I don't ever have to think about pixel-values again.

I even ported it for React Native: https://github.com/tachyons-css/react-native-style-tachyons

I don't know about more obscure but I've frequently used Foundation and like it. It doesn't feel as bloated at Bootstrap. I haven't used Bootstrap in awhile, so maybe it's gotten better, but I always felt like the number of elements required even for a simple modal seemed like overkill.

Skeleton is perfect.

https://github.com/dhg/Skeleton/blob/master/css/skeleton.css

It's tiny, simple, and so easy that if you read it and understand it, you could write it again yourself. It's meant to be tooled and modified to suit your needs. Bootstrap is just gigantic, it's a big unwieldily blunt instrument that eventually needs to be removed from the project.

The framework in OP bothers me because of the way it handles margins around components, makes unnecessary use of flexbox, and hides the entire sidebar of the page on mobile. Which I don't think will often be very useful.

I'm very opinionated about my css frameworks.

Skeleton is good, but not prefect on mobile.

You can try it on your iPhone http://getskeleton.com

As I tried, scrolling in a scroll-view (the overflow:auto section) is not smooth, <select> element is ugly, and the <pre><code> even not working (although it might be the website's problem, not the framework's, it proved that they didn't tested on mobile)

Skeleton has another major issue, it overrides the default styles of <input>s and <table>s, making it very hard to set it back. This is not friendly to third-party libraries. As far as I can see, no other frameworks did this.

I haven't had any of those problems... but if you don't like something it does just delete those lines. I'm not hard line about these things, it's just my favourite one.

I use my own library extensively (which has been on HN few times), mainly because since I made it I know every bit of it. But I use it as a base to grow the style and have decent ground such as buttons/inputs/etc.

So I only need to take care of the bigger things like colors and shapes, while the library makes sure the small bits are consistent (widths and heights, box-sizing, :hover and :active, etc).

I've tried not using it but the amount of work required to make CSS work and look nicely with all those quirks just doesn't make sense. It's much easier to overwrite a background and border-radius than to write a proper button from scratch.

Next step, I'm thinking about making it all abstract with scss then I can just @extend those %placeholders.

Thats the thing right, a CSS framework with a lot of sweet features is a lot of complicated. There's so much to learn it's almost easier to just use plain css.

But if you make your own framework, it's much easier because you know it all.

Reply on news.ycombinator.com