How can I make website exact fit to different screen resolutions?

Question

How do I adapt and exact fit (i.e. height and width both) to different resolutions? How to scale down image element as per screen resolutions maintaining their aspect ratio and positioning like left, top etc. Please help me out with- what approach should I take. Is making different images for different resolutions is only option?

Please check reference I want similar kind of result. Every element is adapting nicely on each n every resolution - blacknegative.com

Using HTML and Jquery!!!

Answer 1

you do this by getting screen resolution and all this are inherit in percentage wise screen resolution, you can get this from any where, using javascript also or by applying 100% width

Answer 2

The easiest way is to use a Responsive Design Framework like Foundation.

Answer 3

You Can Utilize CSS Frameworks like foundation and Bootstrap. Use CSS - Media Queries to make your website viewable in all sort of devices and in different screen resolutions.

Answer 4

what you can do is to set the size in the HTML/ASP variable as percent (e.g: 20%) instead of pixels this will take the size of the window and modify all the elements as 100% represent full size.

HTH

Answer 5

Set all your dimensions to percentages. You can also use css media queries to specifically target certain devices or resolutions.