I am currently working on “Build a Tribute Page” on FCC. I am observing the example’s HTML code and how it works with the Bootstrap CSS classes. I am having trouble understanding how responsive design works exactly. I’m currently throwing things at the wall to see what sticks, but I’m a bit tripped up by this bit of the tribute example:
I have a bit of an idea on how this class works, but I am confused on how the placement itself is decided. Do the columns stretch vertically based on what you need? How do I decide what is right for each col-*? Is it simply trial and error? Is there a way for me to be able to see each col and how much space it takes up?
Is there a program that will allow me to see how things would look if viewed on a tablet or phone?
Finally, what is the proper way to use col-lg-*? It seems it’s meant for larger computer screens, but I am unsure how the browser would know the difference between a lg browser and a md browser. If that makes any sense
Thanks in advance for any help given!