How to get just the responsive grid from Bootstrap 3?


Tags: html,css,twitter-bootstrap,responsive-design

Problem :

I need to add responsive design features to my web application using Twitter Bootstrap. I just want the responsive behavior, I'm not interested in the typography, components or any other stuff included in Bootstrap.

I got a customized Bootstrap version just selecting the grid system. However, when I add the generated CSS to my application, all my styles are messed up (header, links and others). Why is that happening? How can I get a Bootstrap CSS with just the grid system? I would like to avoid a manual modification of the Bootstrap files.

Thanks!



Solution :

Go to http://getbootstrap.com/customize/ and toggle just what you want from the BS3 framework and then click "Compile and Download" and you'll get the CSS and JS that you chose.

Bootstrap Customizer

Open up the CSS and remove all but the grid. They include some normalize stuff too. And you'll need to adjust all the styles on your site to box-sizing: border-box - http://www.w3schools.com/cssref/css3_pr_box-sizing.asp


    CSS Howto..

    jQuery - how to “reset” a .css() rotated icon?

    How to structure CSS classes? By entities or by aspects?

    How to position background image inside table cell with padding

    How to keep width of the main container to maximum width in a 3 column fluid layout?

    How can I get .less compiler support in Visual Studio 2012 Release 2?

    HTML/CSS: How to make “password” input show the password?

    How to do “display = block” using jquery for particular element

    How to find a unique identifier using CSS for a class

    Show 100% of background

    How do I move this scrolling bar closer to the post area?

    How can I include an element within a div without using html?

    how to call all Google font CSS under specific font face

    If a child has a certain specific value, how to check and make “true” so that hover of the parent yields a result?

    How to center a banner and keep margin?

    How to align image with text in a table ? (jquery datatable sort image with text in table header)

    How to slide/grow a tile to position with 90x90px with CSS

    How to change a position of css sprite image?

    How to make a
    container width and height for each same as “the value of clientWidth and clientHeight in maximized window”?

    How can I apply CSS only to digits in jQuery?

    How to set alternate row color for a given attached diagram

    CSS: How to set minimum and maximum height according to inside?

    How do you apply diferent colors from diferent css rules to the same object?

    how to create a image slider with help of only HTML and CSS?

    How to make css layout to fit html content?

    How to align text and images on one line and position those to the left and/or right?

    How to center an isometric grid on a background with CSS/JS

    How to make possible vertical scroll on popup and disable vertical scroll for page by using CSS?

    How to create an interactive image with HTML5, Javascript, DOM and CSS

    How can I get a relative div to expand to fit its absolute contents?

    How to load CSS on SSL pages?