Another Flexbox based CSS Framework?

by Andy Prevost

Sunday April 14 2024

I've been researching switching from Bulma to Bootstrap. Why? Well, you simply can't ignore that the path Bulma is on with v1.0.0 is contra-indicated for mobile sites. Gheez, v1.0.0 is now 713Kb from a cdn source. And you still need javascript, adding to the problem. Using Bulma v1.0.0 is like trying to suck an elephant through a straw.

About the only "plus" on Bulma's side these days it is class syntax. It is quite intuitive, for the most part. I would like to see the core use "row" or "grid" instead of "columns" ... and there are a few other examples too. In my own modifications, I've added "row" to use interchangeably with "columns".

My research has also found another Flexbox based CSS Framework. And, the class syntax is very intuitive as well. With a few changes I can actually see using it as a drop in replacement for Bulma (at least v0.9.4) with support for Dark/Light mode and with a Horizontal Navbar that supports any html (mega-menu style).

And, it's under 125 Kb. I'm doing some tests with it now – it's a project abandoned a few years ago – and I'm adding all the javascript necessary to make it work. I plan on a JQuery (slim, minimized) implementation. I also plan on having a "back to top" implementation with both CSS and JS, as well as a Dark/Light mode with a toggle switch. And, keeping it under 125 Kb.

I seriously doubt that I will release this as a project, though. I am more interested in documenting my experiences with Bulma. When I initially started using Bulma, I was ecstatic at its simplicity. I was thrilled at how fast initial implementation could be. Over time, however, I have grown disatisfied with the limitations and wrong-headed opinions designed into the framework. One of the most frustrating is the utilities and mini-reset built into the core of Bulma ... it is in the version I use actively, 0.9.4. The utilities and mini-reset continue on in v1.0.0. Most of my own "fixes" are to fix the negative effects of the Bulma utilities and mini-reset. Bulma is one of the few CSS frameworks that go to this extreme and alter the very foundation of how CSS tags are supposed to look. In v1.0.0, even font families are hard-coded ... come on, a website designed with v1.0.0 will look differently if viewed with Chrome vs Firefox and other browsers. That's wrong! Period.

I also join a growing chorus of users disatisfied with the direction of Bulma. Many are noting that the marketing of Bulma is heavily dependent on support garnered by gambling and bitcoin supporters. I also note that many initial comments touting Bulma's ease of use come from developers of those gambling and bitcoin sites. At least one developer of themes and templates has abandoned Bulma in favor of another CSS framework. At least one theme/template producer has issued negative comments on the direction of the current package.

Now, you need to put my comments in context: I am not a mover and shaker in themes and templates. I am not a CSS expert (by any stretch of the imagination) and I do not use SASS. I just develop a few websites and web applications. CSS Frameworks are a "necessary evil" to me, nothing more. I am not interested in participating in any package development efforts, and certainly not interested in sharing any possible improvements. I go out of my way to make UI as simple and easy as possible for the end user. In the case of a CSS Framework, there are TWO USERS ... the developer is the user of the CSS Framework, the end user is the person viewing the website. In the last cast, a reasonable size package that is responsive is the goal.

And, right now, my advice is to use something else other than Bulma. If you start with Bulma, you are initially enticed by the simple class syntax and reasonable HTML structure. After that, you are constantly drawn into the "rabbit hole" of fixes and work-arounds. Save yourself the hassle.

 

◀ Previous Next ▶

Post a Comment