Does anybody have any theories why a standard row of Bootstrap columns would be displayed stacked vertically (along the left side of the screen), rather than following the horizontal row breakpoint layout defined in the code? I did a test page, and found it was doing that on an iTouch and Nexus7, yet displayed properly on a desktop PC (all sizes of the browser window), a iPad tablet, a Samsung Galaxy phone, and the Pinegrow preview.
Bit of a mystery that we haven’t figured out yet. Coding SEEMS to be correct, since it displays properly on many devices.
Browsers appear to be up to date. I tried the same test page with Bootstrap 4.1 and 4.3… same result. All columns end up lined up vertically along the left side (despite the row itself having room for another column).
I posted in the beginners section, but since not getting any solid answers yet, I figured I might post here were it may be seen my some senior Bootstrap pros who might be able to come up with some theories (and hopefully some way to fix it).
UPDATE: Now, for whatever reason, I’m finding that some of the premade Bootstrap blocks (which have a similar multi-column thumbnail layout as my test page) are also displaying incorrectly, right in Pinegrow! The screenshot is a new, empty project, with one of the Gallery blocks dragged in. All but the last of the 4 (Gallery 2) displayed with the columns vertically stacked, aligned to the left of the screen. The fourth displayed properly, as do many of the other similar multi-column blocks.
Nothing altered or added. Just dragged the block from the library. Used to work (up to today), but now suddenly now some the premade blocks are not displaying properly, too.
Hi @ladlon. I’ve set up the same layout on my computer and I’ve no issues (screenshot attached). Can you check under Development Tools and see if there are any errors.
Hi, Rob. Thanks for the response, and trying that out for me. Ya, the issue is NEW for the premade Bootstrap blocks, those were working up to about a day or so ago… so I figured something might have gone corrupt. It’s like horizontal stacking is completely broken… but just on SOME of the items. The Bootstrap blocks were previously working, and there were no display issues with Pinegrow or the PC desktop display of any tests. Aside from this new change in the issue, all sites were working fine in all the platforms I was testing, except for on an iTouch or Nexus7.
I’ll look into the Development tools thing, and get back to you. Thanks. I suspect it may be something with the bootstrap style sheet generated, or the bootstrap files, as the overall/original issue (not this new one where Pinegrow itself is displaying wrong) is happening on any and all new test projects… so most likely it’s not just incorrect coding, and certainly not a mistype.
What was interesting, too, is that I had visited a w3schools page that showed a live sample of a multi-column page (one of their ‘Try It’ pages, where it has the split screen of code and display), and even THAT was displaying incorrectly on the Nexus7 and iTouch… so, it’s definitely something specific to those devices… but not necessarily the browser (as other devices with Chrome DID display fine), and not necessarily the ‘company’, as other Apple products (the iPad) did display everything fine… Really puzzling, that it IS displaying fine on MANY devices, but not some.
Support has been looking into this, and has asked me to delete some of the Pinegrow folders to reset things, so I’ll be trying that next.
