This is the first div on my page. It's got a bit of text in it, and it's styled so that it looks frankly beautiful, I think you'll agree.
I've given it a border so that you can see where the div is - this border is going to be thick and dotted. You'd never design an actual page to look like this, but that's not the point, honest.
There are lots of ways you can choose to implement media queries, but the basic idea is that CSS3 media queries apply different styles based upon different aspects of the viewing device.
This is the second div on my page. It's got a bit of text in it, and it's styled so that it looks frankly beautiful, I think you'll agree.
I've given it a border so that you can see where the div is - this border is going to be thin and solid. You'd never design an actual page to look like this, but that's not the point, honest.
This should move around when the screen width changes; that way when the width goes below a certain size the content shuffles. Note - the HTML is exactly the same
This is the third div on my page. It's got a bit of text in it, and it's styled so that it looks frankly beautiful, I think you'll agree.
I've given it a border so that you can see where the div is - this border is going to be thin and dotted. You'd never design an actual page to look like this, but that's not the point, honest.
This should move around when the screen width changes; that way when the width goes below a certain size the content shuffles. Note - I might have been a bit silly with these media queries...