Can we make website scalable , stretchable like elastic rubber including text ,images, video, JavaScript and that site should be accessible from all devices which access to web?
I want to set max-width 980 px for site but minimum width can be everything and height should depend on content.
In the book CSS Mastery, Cameronn Adams explains just that, dig that out :)
You can ease your development by doing separate CSS for different media
Otherwise, it might be a bit tricky, as floatable designs are really really difficult to get accross paltform/browser.
I recommend that you look at this page:
However, I recommend that you mak at least two layouts - either by separating CSS or by having differtent HTML templates:
becouse those differ in how UI (and UX) works. For example you might need to make bigger buttons in mobile, which would look cumbersome on a laptop browser, or you might need to rearange menu position on different platforms.
The technique is a few years old, and I haven't seen it used in a long time, but you could perhaps try using javascript to load different stylesheets based on screen resolution?
See here for more information:
Personally I was never a fan of this method, but in theory it should do (more or less) what you want. The only issue might be a little updating is needed for newer browsers. Non-JS devices such as mobiles can be taken care of with a good default stylesheet and well-structured underlying HTML.