_README.md

# Bootstrap Grids

1. Download a copy of [this repository](https://github.uconn.edu/bpd01001/advweb-exercises/archive/master.zip)
2. Copy the `bootstrap-grids` folder to your working directory.
3. Modify `index.html` to match each of the layouts below. You should only add Bootstrap classes to the markup. (Hint: Try mobile first)
4. When complete, upload the `bootstrap-grids` folder to your directory on the DMD server.
5. Submit the URL to HuskyCT.

## Help
* [Bootstrap: Grid System](https://getbootstrap.com/docs/4.1/layout/grid/)
* [Bootstrap: Column Wrapping](https://getbootstrap.com/docs/4.1/layout/grid/#column-wrapping)
* [Bootstrap: Column Ordering](https://getbootstrap.com/docs/4.1/layout/grid/#reordering)

## Layouts

The purple overlays should help you determine the column sizes.

### xs
![Extra Small Grid](https://github.uconn.edu/bpd01001/advweb-exercises/blob/master/bootstrap-grids/xs.png)

### sm
![Small Grid](https://github.uconn.edu/bpd01001/advweb-exercises/blob/master/bootstrap-grids/sm.png)

### md
![Medium Grid](https://github.uconn.edu/bpd01001/advweb-exercises/blob/master/bootstrap-grids/md.png)

### lg
![Large Grid](https://github.uconn.edu/bpd01001/advweb-exercises/blob/master/bootstrap-grids/lg.png)