Click here to Skip to main content
11,922,641 members (32,206 online)
Rate this:
Please Sign up or sign in to vote.
See more: CSS HTML
hi guys
i have a general question,i have back end developer of an web site,i'm familiar with html and css but i'm not an expert.
my site works fine on my laptop but when i browsed it with smaller screen laptops or with mobile devices,i see that for example some components(inputs,images,...) do not fit the screen or their are on top of each other!
it seems that this html page only looks fine on 16inch screens
how can i optimize html for different screens that they all look the same,and in next step how can i optimize for mobile devices
Posted 12-Dec-12 4:27am
aspnet_regiis -i 12-Dec-12 9:37am
There are thousands of ways to get the markup screwed and I cannot guess which might be your favourite unless you show us the HTML you have written...

You dont need to optimize, but write a compatible markup for all browsers and screen sizes
Rate this: bad
Please Sign up or sign in to vote.

Solution 1

Hi Arash Khangaldi,

This is totally dependent upon your design structure.

Let me share my knowledge with you.

1. If you are designing a page using the height and width of any
or with the values in "pixel" then while the window is adjusted the page and the controls that you have set for your page will try to adjust with the given portion but you have given a fixed length for the page controls. so that will then be distorted.

2. If you are designing the page with the values defined in "%" then your page controls and the value of the width and height of your controls will be adjusted in "%".
This will not distort your page.

This takes the whole page as 100% and divide the length among themselves.

For better understanding view this link.
{ Difference between em, % and px; }
percentage vs pixels?

Arash Khangaldi 12-Dec-12 10:12am
thank you,it helped :)
Krunal Rohit 12-Dec-12 10:19am
Awesome man.. :) +5
Rate this: bad
Please Sign up or sign in to vote.

Solution 2

you can use the percent for width of you page. Because when you want to use fixed pixel then the resolution mismatch with your given pixel.

one thing, when you use percent for width or height then you must use all the tools with percent. I mean, dont use like some tools with pixel and some tools with percent.


This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)

  Print Answers RSS
Top Experts
Last 24hrsThis month

Advertise | Privacy | Mobile
Web01 | 2.8.151125.1 | Last Updated 12 Dec 2012
Copyright © CodeProject, 1999-2015
All Rights Reserved. Terms of Service
Layout: fixed | fluid

CodeProject, 503-250 Ferrand Drive Toronto Ontario, M3C 3G8 Canada +1 416-849-8900 x 100