[ad_1]
https://i.ytimg.com/vi/xaREA2h7VmA/hqdefault.jpg
Website: http://bootstrapbay.com
Source Files: https://github.com/bootstrapbay/tutorials
In this installment of our Bootstrap 3 tutorial, we go over the Bootstrap grid system and how the responsive design works.
Bootstrap includes a responsive, mobile first fluid grid system that appropriately scales up to 12 columns as the device or viewport size increases. It includes predefined classes for easy layout options, as well as powerful mixins for generating more semantic layouts.
Original source
10 responses to “Bootstrap 3 Tutorial Pt.6 – Grid System”
0:53 What the middle finger represents???
These are awesome, but the footer still blocks the text when I shrink down the screen. The quick fixes i found on youtube all didn't work and I copied the code letter-by-letter. What is happening?
Best tutorials for Bootstrap I've ever seen, Cheers man
can anybody tell me whether the grid system will work or not when javascript is disabled on browsers?
The horizon goes from left to right not from top to bottom, that's called vertical. xD You made that mistake quite a few times
Nice video … I've added a second row below… "Sections 4, 5, 6" across… in the above "section 3" will be a contact us form… but with that the entire "second" row get pushed down and out of line with row 1… Can you please shed some light on how to vertically align section 4 & 5 with 1 & 2 – with section 3 extending "into" row 2…? Nesting 4 and 5 with 1 and 2 works – but the problem with that is the form (in section 3) gets displayed on mobile devices below section "5"… want section 3 to display after "2" on mobile…
im trying to build a portfolio site could you make a video with and about section and a gallery?
Good clear explanation..Thanks.
Hey, I go to the point where I copy and pasted the row class twice, but it will not show all horizontally, it stacks vertically no matter the size of the preview in Firefox.
Note: I have it down as col-sm-4, tried with md as well. Also I am not testing on a server I am just doing it locally.
Any help would be great thanks!
After you changed md to sm I think you got your horizontally vs vertically mixed up. On the smaller screen they stack vertically, not horizontally… =o)