Expected behavior

I would like to create a layout, which has ONLY three fields and fixed navigation so that the content is always 100% of height and width despite of the device and orientation. When the "device" is normal browser (a lot of space), it will have one field in the top and two field or areas below it side by side:

There should not be bleeding or escape outside of the screen, images should be responsive depending on the size of the screen.

Actual behavior

I cannot get those three boxes fo fill the whole screen without escaping the full screen view.

Thanks