I have been working on this website and it is almost over.. until I discovered my computer is on a high resolution (1920 x 1080px). I tested my website in 1024x768px and it was... not what I expected.
Anyway I searched far and wide around the web and there are still questions that I did not find answers to, so I am here to ask you , hoping to find an answer !
First of all, what I want about my website, is to be comfortable to any screen resolution on computer, from 1024 to 1920. Also, I want it to be comfortable when you reduce the window (you know, like when you make a webpage only cover half the screen).
( English is not my mother tongue so I hope it will still be understandable for you guys.. )
1- I began using px. That does not work on lower resolutions, users have to unzoom. So now I am using % as advised on the web. But now when I reduce my window on the left of my screen, it adapts too, but too much.. I want it to make a horizontal scrollbar appear when you reduce the window too much. SO basically that is my question, what should I do ? I find many websites that work fine (like this one, if you reduce the window a horizontal scrollbar appear !) Maybe combining px and % ? I don't know, I really have no idea what to do.
2- Is the resolution of the screen comparable to the size of the window on a screen ? For example, my resolution is : 1920x1080px If I put my window on the half left of my screen, will be equivalent to a resolution of 1920x5040 px ?
3- For phones and tablets, is it just a question of smaller resolutions ? Or is there something more ?
Thank you so much for helping me on this one ! Cheers, Bill
overflow: hidden
, so you need to remove it or change it to overflow: auto
min-width
of that container.