Display all contents on one page

Display all contents on one page
0.0 0

#1

There is a requirement that no matter what the size the users adjust the browser, all the content should be display on one page and no scrollbar. Does anyone have a good idea to realize this? What should I do?


#2

get real cuddly with percentage values for sizing and also embrace the viewport relative values for CSS: https://www.w3.org/TR/css3-values/#viewport-relative-lengths


#3

thank you very much , it helps me a lot. but there are still another issue unsolved, if users adjust the browser to very small size,it still can not be possible to show the all content. May I limit the min-size of the browser?


#4

it’s possible, tho you’ll have to use jQuery (see this post for reference: http://stackoverflow.com/questions/10610899/disable-browser-window-resize)

that said, if you make liberal use of the vh and vw properties for your element sizes (vh for height and vw for width, of course), you should be able to manage all the content on one window, albeit at some point it will obviously get too small to be discernible.


#5

your answers give me great helps. I have try to use the resizeTo to limit the browser’s size to fixed size, However I meet a strange thing. It seems that sometimes the resizeTo work fail and it cannot stretch to the fixed size. I use the IE11 for the testing, but different version of IE11 behaves differently. I have searched but cannot still find the reason. Is there anything I ignore?