I'm using bootstrap and if I use a fixed width and auto margins on container-fluid to center the content it looses the responsiveness.
Is there a way to avoid this? Or the responsive design means there is no fixed width?
HTML
<div class="container-fluid"></div>
CSS
.container-fluid {
width: 960px;
margin: 0px auto;
}
Twitter Bootstrap already have a class to do what you want and his name is "container" he uses fixed widths, but that width is different using media queries rules so it became smaller as the screen get smaller, and when less then 767px that container is 100% of screen size.
Basically, "fluid" and a fixed width are contradictory terms. But there are lots of options. For example, you could set a max-width and min-width instead of just a width. Or your could set a width in ems which still gives the layout some flexibility (especially when combined with % width columns).
Another option is to set your 960px width, but to change that width at different screen sizes with @media queries.
Try to add an id in the div and apply the changes there in order to respect the pre-configured container-fluid class
