[#45674] - Bug in Media Vendor Bootstrap min.css - breaking grids on old MacOs
- New
- Medium
- Build: 5.3.1
- # 45674
Joomla 5.3.1 (and maybe after) was been shipped with an incompatible version of .css with the shipped .js in media/vendor/bootstrap. The vendor/bootstrap works on most browsers, but there are issues with old Mac desktops.
For the next minor release please ship with an updated bootstrap.css (BS 5.2.3 works fine).
Also - please do not strip out the BS version comments in your shipped version of BS. It makes it hard to check what version of BS you are shipping - and has probably lead to this problem?
You'll need to use a Joomla template that uses media/vendor/bootstrap (and not current online versions of bootstrap).
You'll find the BS grid system will break on old macs, resulting with the (default) XS layout only. It looks bad on large desktop screens.
Steps to reproduce the issue
When using a template that uses vendor/bootstrap.min.css - and a script from vendor/bootstrap/js (say dropdown.min.js) - you will find on macOS Catalina Safari 13, BS grids will break and it will not render properly.
Expected result
For large screens, content should be shown in grids.
Actual result
Only shows layout for XS for any screen size. (No grid functionality)
Also other issues...
System information (as much as possible)
Bug shows up on old Mac - use lambdatest - macOS Cataline Safari 13, Joomla 5.3.1
Additional comments
To fix, overwrite media/vendor/bootstrap/css/bootstrap.css (bootstrap.min.css and bootstrap.min.css.gz) with new versions. (BS 5.2.3 works fine)
The existing vendor/bootstrap/js seem to work (but might need more testing).
| Labels |
Removed:
?
|
||
joomla-cms-bot
- | Labels |
Added:
No Code Attached Yet
|
||
| Title |
|
||||||
QuyTon
- | Labels |
Added:
bug
|
||
@Satish-Medar we don't assign issue, you can simply submit a pull request
Joomla 5.3 ships with BS 5.3.3 therefore according to the original report this must have been fixed
It doesn't appear so. I think somebody on the development team keeps making the same mistake.
If they left in the Bootstrap version comment - we may be able to tell what version they used - and where ... but sadly somebody keeps removing this critical bit of info.
This Bug still exists. Any old MacOS will not render the Joomla distributed BS correctly.
I can confirm again... the problem is solved by overwriting the Joomla 5.3.3 packaged vendor/bootstrap/css/bootstrap.min.css with a the official Bootstrap version 5.3.3 (https://github.com/twbs/bootstrap/releases/tag/v5.3.3)
So the solution is to basically
- Don't remove Bootstrap version comments
- Replace vendor/bootstrap/css/bootstrap.min.css with a proper official version. (Joomla's version is corrupted - or not version 5.3.3)
Until they do this... Joomla websites that use the shipped vendor code will continue to fail for old Macs. (And who knows what else fails?)
I'm about to give up and just provide an official uncorrupted version of BS in my template. I cannot keep having websites fail everytime Joomla updates.
Joomla's bootstrap is NOT corrupted. You can check the source code here
The Joomla 5.3.3 shipped media/vendor/bootstrap/css/bootstrap.css is 271KB and has 100's of lines different to the Official Bootstrap 5.3.3 bootstrap.css (275KB).
After a quick look, nothing major, but maybe it could be that the Joomla shipped bootstrap.css omits the "0" on decimals. I don't know, I don't want to argue, don't have time to debug 14,000 of lines... when it should be the same as the Bootstrap official.
Joomla Version...
.g-md-1, .gx-md-1 {
--bs-gutter-x: .25rem;
}
Official Bootstrap version 5.3.3
.g-md-1,
.gx-md-1 {
--bs-gutter-x: 0.25rem;
}
The Joomla shipped bootstrap.css is definitely not the same - and indeed breaks on older Mac's.
Replacing the Joomla shipped bootstrap.css with an official Bootstrap bootstrap.css fixes the problem,
I can confirm that their is a bug somewhere in our build scripts that is indeed stripping the comments/version number from the bootstrap.min.css. Its weird as it doesnt happen in a developer build. I apologise for doubting you
FWIW some time ago Joomla switched from postcss to lightningcss and many of the patches are lost. Also fwiw Joomla only supports the last 2major versions of safari contrary to bootstrap that goes a bit further back
Related #42439