Why are div boxes moving around strangely on resize (bootstrap)



 Why are my div boxes on this page collapsing to the left (single-file) as the browser window gets bigger.  Have I coded this wrong?  I searched for some time on multiple occasions and haven't found anyone address this issue online.  Help is much appreciated in ironing out this wrinkle in my first FCC project.

Link to troublesome page: my portfolio page




Bootstrap makes your page responsive so as the size of the browser changes, so does the arrangement of the page. It’s not a bug, it’s a feature :slight_smile:


So by that, are you actually saying it’s a bug? Or are you possibly confused about my question?

In case of the latter, please notice how the centered two-column grid switches to left-justified once the browser goes beyond a certain size in chrome and collapses to a single vertical column, also left-justified, in Firefox.




No I’m not, the page resizes elements as bootstrap sees fit based on the available screen space I’m being literal when I say it’s not a bug, it’s a feature. When your screen is very small yes is will start collapsing columns, however you aren’t required to use bootstrap, if you dislike the responsiveness you can remove from your page.


Yes, of course I get how bootstrap works. Let me clarify, then – I’m talking about collapsing columns when I increase the browser size, hence believing it to be an error in my code or a bug. Please try the link and see what I mean.


I’ll do a code review shortly and tell you if I see any issues that could be causing it :slight_smile: