Website Lay-Out Design - Changes when Zoomed
Hi, I have a website that I am working on right now and I need your help. Everything seems to be working now except for one thing. If you view the website in 100% zoom level, the lay-out seems to be in order and okay, like the alignment of the menu.
However, if you try to change the zoom level to say 130%, the alignment of the menu changes and goes out of place. My client does not want this and he wants to keep the lay-out the same without any changes even if you zoom in or out.
What seems to be causing this problem, and what are the ways how to solve this? Your opinions and suggestions are really appreciated.
I really appreciate if you could please take a look at the website at http://www.aljoufilaw.com and try to test the issue that I mentioned above. Thanks so much =)
From my point of view, you are using the wrong measurements, take for instance, your body is 1024px; and your side div is 320px; by the time you re-size your browser or views in a smaller resolution, the size remains constant where by going beyond the required. A quick suggestion is to convert the sizes to percentage.
<div id="right-pane" style="width:30%;display:block;height:100%;background-color:#000000;"> </div>
<div id="main-pane" style="width:70%;display:block;align:left;float:left;background-color:#ffffff;"> </div>
Why have you mixed DIVs and a table? I think that may have something to do with it.
And the classes seem excessively complex. E.g.:
id="menu-item-25" class="menu-item menu-item-type-post_type menu-item-object-page menu-item-25">
I cannot make sense of it.
Users Browsing this Thread
There are currently 1 users browsing this thread. (0 members and 1 guests)
Tags for this Thread