Problem adding bootstrap responsive css to muse/bc site

[shel_wagnercreative]

Here's an example of the problem:

http://magnavino.businesscatalyst.com/test-page

As the browser window is made narrower, at arrowed 760px there's some kind of progressive right margin or padding apparently going on. At phone width the content would be all smashed into the left side at like 15px.

Anyone know how to get rid of this?

The template is imported from muse to bussiness catalyst. In the muse file there's an html insert that contains the link to the bootstrap css (

<link href="css/bootstrap.min.css" rel="stylesheet"> ). The two bootstrap css files, that contain only the grid, were uploaded via business catalyst to the css folder.

Please help!

[Liam Dilley]

The problem is you have put the boostrap framework in on top of other CSS trying to control main layout of elements. There is a massive amount of conflicts and overides going on as a result.

You also have what appears to be javascript sticking in that extra padding. Only just had a quick look so not sure what code that would be.

[shel_wagnercreative]

Anyone know what the best way is to get the bootstrap css on top of the other css? There's two bootstrap css files, as shown in the attached screen capture.

[Liam Dilley]

What files you call in your head is the order they load. But you have several overides going on and  you will not address the conflicts in this manner.

You can not use 2 different bootstrap files on top of what I can see being 3 other files trying to control your global styles and get that to work. You need to clean up and decide what framework and CSS structure your going to use and go with that and clean out the others.

[shel_wagnercreative]

Thanks, Liam.