css class prefix

This is more a discussion because I do not believe it is even possible t implement.

What I miss are prefixes. If only every Bs version had prefixes like bs4-modal, bs4-row, bs2-row, etc… that would be a perfect world. It would be possible to create a single HTML markup that would look good no matter what CSS is used, BS4, BS2, Material, UI-Kit, etc…

I am Joomla extension developer and Joomla templates use a different CSS framework. If you want your extension to look good in every template you have to apply different CSS classes. There is no problem with ui-kit. You can always apply ui- prefixed styles. But it is impossible to make markup that would work on BS2 (which is still Joomla 3.5 base bootstrap version) and BS3. Although HTML structure may be the same, All because of class conflicts. row in BS3 is row-fluid in BS2.

Very often I have modal not working because some 3d party libraries also use modal class. Be it bs4-modal there would be no problems as everything else.

I know it is possible to make your own CSS version with prefixes. Not for BS4 though. But I am talking about CSS that is used by others. The only way it could be solved it it was a core concept from the beginning. So, when I create layouts I can relay that if BS4 is used, there will be BS4 prefixes. I know that I can add prefixes. But that only works if you control as themes as a markup of your application. But if themes are made by others it is a mess. Same problems in the Worldpress world.

[mdo]

I really don’t want namespacing for our CSS. It’s not been much of an issue. I don’t think this is something we should take on.

But what if I want to create a universal Web Component that will look good as with BS2 as with BS3 and BS4?

This seems like a bad idea to me. Practically speaking, it sounds like a nightmare, unless you’re making completely isolated web components, in which case you’re already in a tough spot because that’s not what this project is about.

Closing this out for now given the specific use case and post-processors handling the remaining use cases pretty well.

[Serhioromano]

@MartijnCuppens It looks like https://github.com/marceloucker/postcss-prefixer does the job and is quite well maintained.

It looks like you do not hear me or you do not listen. Maybe it is my English skill.

using different versions of Bootstrap in your codebase doesn’t feel like a best practice technique

I agree. I would not use it if I can. But what if I want to create a universal Web Component that will look good as with BS2 as with BS3 and BS4? How? The end-user will use only Bootstrap file, only one version, but different Web Component users will use different versions of Bootstrap.

And I know this feature is BIIIIIIIGGGG in terms of changes that have to be done. But I believe it worth it. Anyway, it is a good practice to nave namespace for a library especialy such a widely used one.