Tribute page won't scale for mobile

Tribute page won't scale for mobile
0

#1

http://codepen.io/StefanT93/pen/ORVQbW

Can’t seem to figure out why this page won’t scale for mobile… any tips?


#2

Avoid using margin and padding to the sides. If you really have to, I suggest using percent-based values instead of pixel-based ones.


#3

You should go back and look at the Responsive Design with Bootstrap section and glance over it. It can help you with a mobile first approach to your website.

Take advantage of their classes such as “container” or “well” to help you organize your information.


#4

I’m using a container-fluid class already (very first line) and an img-responsive class for the image.
Do I need to put everything into a row class and column class?


#5

It would help out. Remember the lesson that mentioned that Bootstrap has a 12 column grid system? Well you can take advantage of that and make your website more responsive and scale better for mobile.

http://www.w3schools.com/bootstrap/bootstrap_grid_system.asp

If you want, this is how I approached the project.


#6

i put in a ‘row’ class and a ‘col-xs-12’ class, but it doesn’t look like it’s making much difference…
Same with putting in a ‘container-fluid’ class, any other ideas?


#7

So it should be fine afterwards?


#8

Give it a try :wink:
It looks fine to me.


#9

It worked, thanks a ton!