Layout using Bootstrap not aligning correctly

I have been stuck at a strange layout alignment issue. I have been using Bootstrap 4 to set layout of a section. Please take a look at the screenshot below -

This is here. It is working as expected. Now, check here -

The exact same plugin breaking on another WordPress installation. This type of issue usually occurs due to the styling on an enclosing wrapper but couldn't find anything. I have been banging my head over it for the last couple of days but could not pin point the issue.

Any help would be appreciated!

Topic screen-layout twitter-bootstrap css Wordpress

Category Web


The issue is due to box-sizing

Bootstrap expects box-sizing to be border-box to work properly, however in your second link it isn't so.

A quick fix is to add this custom css to your project:

.row * {
    box-sizing: border-box;
}

About

Geeks Mental is a community that publishes articles and tutorials about Web, Android, Data Science, new techniques and Linux security.