How to have a shape's size match half of the page's size?

Need help Responsiveness
1

I want to have an image (although I’m testing the design with a simple shape before I start work on graphics) that covers half of the page’s size. I’m basing the image to work something like the image on the left in the twitter login page (https://twitter.com/).
Currently the page covers roughly 65% of the page when I try formatting it, and it doesn’t change as I change the size of the page until it hits a certain threshold, any suggestions?