How to resize DIV element according to browser size?

Question

So here's a project I'm doing for school:

http://graciousevents.co.uk/

The problem is when the browser is re-sized, the photo-gallery moves underneath each other and then the contact DIV gets pushed to the left.

How can I correct this so the contact div doesn't get pushed to the left.

Answer 1

A particular within the DIV selector, if you want strings to re-size with the browser, instead of pixels, use "em".

Ex. div{ font-size: x em }

Answer 2

Are you using percentages for the sizing? If you give the window a set size and use pixels when sizing everything should stay where it is when you resize the window.

BEFORE:

width: 10%;

AFTER:

width:500px;

Answer 3

Change CSS using width: 62.5714%; or Use Bootstrap CSS