0

Hi There;
I have designed a web site. There are buttons at the top of the web site, similar with daniweb.com has "Hardware&Software" , "Software Development" ,"Web development" and so on. But my web site looks perfect in my computer, however, positions of buttons corrupted in different computer that have different resolution settings.I've made visual settings in CSS and I've gave left, right position values in pixels. How can I overcome that problem?

Thanks in advance.

2
Contributors
1
Reply
2
Views
5 Years
Discussion Span
Last Post by almostbob
1

pixels are not a layout tool, the size of a pixel is dependant on screen resolution
current best practice is to use em or % as dimensions for layout, these are scalar quantities that automatically adjust to window size screen resolution and user preference
a page laid out (example) as

body { width:100%; margin:1%; padding:1%;}
.menu { width:98%; margin:auto; padding:1%;}

always looks the same

added benefits of scalar dimensions;
content remains onscreen in partscreen windows, without horizontal scroll bars (Which absolutely P__ off users), on a large range of devices from phones(200px screen) to my laptop, plugged into a wall projector (3072px screen),,
and text auto adjusts to visual impairment font settings, making the site disability friendly

Edited by almostbob: n/a

Votes + Comments
Thank you almostbob.
This question has already been answered. Start a new discussion instead.
Have something to contribute to this discussion? Please be thoughtful, detailed and courteous, and be sure to adhere to our posting rules.