I am attempting to get familiar with Bootstrap and the Grid. I am attempting to create the following macro layout:
| PageTitle |________________________|
|________________________| +1 |________| img| img|
| Make a choice. |_____|________|____|____|
| | |
The grid structure on the right panel of small device seems to be wrong.
In the code snippet of your JSFiddle. On line number
17 and 32, change
class="col-xs-6 col-sm-3" to
This would make the images appear again.
Ofcourse you can, You just need to change the approach your taking to construct, and any structure is possible. Check this Fiddle. It shows columns under rows and rows under columns structure in a way simple to understand.
In your case what you need to do is at the top most level divide your structure into 4 columns and do whatever you want inside each column.
Easiest way to approach and understand any complicated structure :
First Determine how many columns your structure needs. The top most should always be divided taking columns into picture.
Once columns are determined, Consider each column as a full width page and divide again and so on.