Responsive Web Design Height Unit For HTML5 Apps

Hi how am i supposed to set a web elements size in my responsive design html5 project? It's been buggin me for a while % is great but if the parents height is bigger than screen size i'm in trouble right? I've found vh and vw and vmax which are like magic but unfortunately many browsers dont support this units(for example:Android 4.2's WebView doesn't)What unit am i to use then?Or is there some way of making objects have heights based on screen's height or width? Or is there a way of using WebView in android which does support vh and things? To make this clear let's say i want sth which look like this(currently made with vh like units):

http://ift.tt/1xFlXGG

:| i read somewhere that i should not set the height and let the content decide on that but that'd be like having at least 4 sizes of each picture :( !

Any soloutions?How do frameworks like bootstrap or foundation or sencha make sure their elements heights are good? Note:I dont want to use frameworks like bootstrap or foundation!