totally responsive page - dynamic height and width

programming web dev
1

hi,

i have been trying to do a totally responsive page where the images and divs respond dynamically to changes in the browser height and width.

so far this is what i have got: [URL=“http://jsfiddle.net/postcolonialboy/vem2rtet/2/”]fiddle[/URL]

the images change in height and width, however, the position of them should stay within the container and one should float left and one right, no overflow

ultimately, i would like to have this: [URL=“http://i.imgur.com/6ZVaaC7.jpg?1”]http://i.imgur.com/6ZVaaC7.jpg?1[/URL]

where even the text changes height, any suggestions on how to proceed?

thanks

2

Hello 4a0g1kfa54,

Have you found a solution yet?

If yes: Please share your solution.

Else:
You need work with a rem value for the text and set a base size on your html css tag. Also, you need to set up media queries for the text and other elements to respond to when the browser size browser changes. For your general layout, you could also look at working with percentage values for you width & height, margin & padding instead of fixed values. This does take some time to set up but it’s worth the effort and a workable solution to your problem.

Should you need more help on this, let me know.