More than 12 columns


I've recently buy the bootstrapstudio, and I like it on a first sight. I have 2 idea:

  1. I've customized my bootstrap css, and I use 16 column grid. I can import it, and I can use it too, but the studio doesn't recognized the column count, so in the column size/position dropdowns, and the <= => <> >< buttons sizes/positions to 12.

  2. It would be great if I can size the columns by dragging their sides.

Curious to know why more than 12 cols ?

Well, because sometimes in the 12 column grid 1 unit is too wide.

Bootstrap defaults to 12 cols. And size is defined in a different way, so dragging side is not an option. V4 will give you more options, please see but it will be based on the same 12cols model. And there are plenty of reason why that's the de facto standard.

If you really need a different grid model consider not using bootstrap, or use nested cells.

If I can load bootstrap.css into the studio, I think it must be parsed. It it's parsed, the parser can find the maximal column number, and in a program (any program) the column number must be definied as a constant or - better - a static variable. So if the parser finds out the loaded css contains 16 columns (or more, or less), it simply changes the variable to 16 (or higher or lower). Using nested cells is an option, but limited, if you want to center something for example, and the default paddings/margins makes problems too. It's (must be) a simple modification in the Bootstrap studio, but creates better usability.

And yes, I know how the size definied, but if I drag the side of a div, it must be simply change the offset and size class definitions. And also: if I drag the center of the div, it must be simply change the offset class of the div.

These modifications are not complicated.

I don't know why 12 is the de facto standard, but on bootstrap customisation page man can change the column number, so it must be not too hard limit.

What you need to remember is that the devs use the bootstrap standard and whilst this is something that is lf benefit to you, no one else has requested it and unless there is a massive gain to be made by doing this (which I can't see personally) I can't see this being implemented anytime soon sorry

Chris, are you working with the developers closely?

I would like to hear this from one of the developers. As I said, if this program well designed, changing from 12 to any numbers of column need to be a small modification. Really. I programming since 30 years, this column count must be definied as a constant or in a static variable, so modifying it is not a big deal.

I don't work with the developers closely but have come to realise that they only focus on delivering new updates (quickly) for things that are going to add lots of value.

I'm sure you can appreciate (like I do) that the devs have a backlog of things to do / are currently working on so ill wait for the devs to see this now comment on how important they think this is to justify making a high priority for them

Thank you for opening this thread!

We will support different grid sizes eventually. One of the things we would like to do in the next releases is to have a way to import customized config.json as a theme, and compile it to CSS. We can also adapt things like the Bootstrap Studio grid tools to match your column count. There have also been suggestions to have an interface for customizing the config.json in the app itself, which would be interesting.

But for now we assume that your theme follows the Bootstrap grid default of 12. You can still write the col-- classes manually, but the grid buttons and settings don't work correctly.

This sounds good. Thank you. Loadable/importable config.json is also a very good news.

Have you considered using a table layout instead?

Placing a table within a fluid container (with a standard Bootstrap 12-col row) would allow you to add as many table columns per row as you like.

Using table in a responsive world is a very bad direction.

Well, until a 16-col responsive row is available as a standard in Bootstrap, you will have to find a work-around for your custom requirements.

One thing to remember is that a Bootstrap responsive column can be divided further into rows and columns as required.

Example of supporting more than 12 columns within a row

Hi Martin, our company builds websites in typo3. Our design-team should use a software like yours to design directly with the bootstrap-possibilities. The bootstrap-rendering of our different customers varies in the grid. Some pages uses 1/3, 1/4, 1/5, 1/6 columns. Because of this we configured our typo3-bootstrap to a 60-columns-grid. I've tested software for designing bootstrap pages. Your software could be great to reach our target, but we need to change the 12-columns-grid to a 60-columns-grid (1/1, 1/2, 1/3, 2/3, 1/4, 3/4, 1/5, 2/5, 3/5, 4/5, 1/6, 5/6). Will this be possible in the near future?