Now that flexbox is widely supported, I don't really see a huge reason to bother with a framework like this. Bootstrap and other frameworks had a reason to exist several years ago; now I just don't get it. The main draw for me and my team was the consistent row and column layouts.
Also, the `container-side` thing is baffling. Why is that part of the framework? It seems like such a narrow focus. What kind of content is never visible on mobile? Why does it have to be on the side?
They seem useful for prototyping design decisions, but less so for structural needs. Ie, i'm pretty bad at design, i can iterate to something i like, but it's slow and not something i enjoy. If i need a design for a side project, i'm not going to want to spend much (any, really) time thinking of fonts, colors that work together, etc. Frameworks can make that easy, atleast.
Also, there are elements of design in structure, too - ie how consistent you are with spaces between elements. I don't really want to think about any of these.
Apologies for the tone in my previous comment. I guess it came off pretty harsh. Good work on creating and releasing something to the public. Upon looking again today, I like the overall approach you've taken and it seems very reasonable.
The `container-side` thing just feels very opinionated to me. I'm not sure it belongs in a framework, but that's totally your call.
I would argue that big frameworks like Bootstrap still have a reason to exist because they provide interactive, component based functionality.
It's actually small frameworks like this one that are increasingly useless. Consider that most of the provided functionality can be accomplished with 2-3 css properties.
More than 20% "active" Android devices out there still don't support flexbox. So unless you are targeting websites only for high end device owners, flexbox only is still not an option.
Edit: Posted it too fast! On CanIUse I checked support for Android Browser. However Google Chrome for Android is supported on 4.1 and above. So most likely many Android users running Android 4.1 to 4.3 may be using Google Chrome. However it's hard to know how many.
All browsers lower than IE11 are NOT supported by microsoft and are a security risk. People should not support them, a lot of websites like youtube and others will not really function correctly in them.
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?
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.
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.
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.
What's the norm if you need a desktop and mobile version of a webpage, to have one separate code base for each one(can be on the same repo) or all the code together with the appropriate screen size detections?
I think the question is who is your target customer. If you are building a website that focus on mobile user, it's no need to design and test for desktop.
In this case Mobi.css is a choice. You can show a QRCode to guide people to mobile.
Also, the `container-side` thing is baffling. Why is that part of the framework? It seems like such a narrow focus. What kind of content is never visible on mobile? Why does it have to be on the side?