Solved

css

Posted on 2012-04-09
4
162 Views
Last Modified: 2012-06-27
Hi,

What is the differnce between em, px and % ?
which one of the three maintains consistent design across browsers and resolutions?
0
Comment
Question by:genius_geek
  • 2
4 Comments
 
LVL 12

Assisted Solution

by:Pra4444
Pra4444 earned 100 total points
ID: 37823597
Here is a good explanation on what you are looking for...

http://kyleschaeffer.com/best-practices/css-font-size-em-vs-px-vs-pt-vs/
0
 

Author Comment

by:genius_geek
ID: 37823634
thanks. not only font size. I am talking in general. for instance, width or margin or etc or whatever...they all can be specified in px, em or % and i want to know which is a standard way?
0
 
LVL 16

Accepted Solution

by:
s8web earned 400 total points
ID: 37824163
There is no standard way per se. Just different ways. Px or pixels is a very specific amount of space, measured in pixels. Designs that are 'pixel perfect' usually have most elements specifically defined in pixels. Most fluid layouts utilize em or %. Percent is the amount of space the element should take up with reference to its parent container. If there is no parent container, it uses the size of the users screen. Em is the width of the character M. It is very useful, but a holdover from printing. There are many different methods. Personally, I like to define the parent container and base font in pixels, then use percent and em for everything else. If I want to scale the design later, which a almost never do, you only have to change the parent.
0
 

Author Comment

by:genius_geek
ID: 37826133
thanks s8web. it was really informative. I might just try your style, parent in pixels and rest in percent. Do you think following this style will make any difference if the users have different screen resolutions?

my entire idea behind starting this discussion was to find a way to design page/form elements such that they appear same across different screen resolutions.
0

Featured Post

How your wiki can always stay up-to-date

Quip doubles as a “living” wiki and a project management tool that evolves with your organization. As you finish projects in Quip, the work remains, easily accessible to all team members, new and old.
- Increase transparency
- Onboard new hires faster
- Access from mobile/offline

Join & Write a Comment

Suggested Solutions

Introduction A frequently asked question goes something like this:  "I am running a long process in the background and I want to alert my client when the process finishes.  How can I send a message to the browser?"  Unfortunately, the short answer …
So you have coded your own WordPress plugin and now you want to allow users to upload images to a folder in the plugin folder rather than the default media location? Follow along and this article will show you how to do just that!
In this Micro Tutorial viewers will learn how to create navigation buttons that change on rollover, using CSS (Continuation of the CSS Image Sprite tutorial) Create a parent ID for all the list items       - Specify position: absolute and display: block…
In this tutorial viewers will learn how to style elements, such a divs, with a "drop shadow" effect using the CSS box-shadow property Start with a normal styled element, such as a div.: In the element's style, type the box shadow property: "box-shad…

707 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question

Need Help in Real-Time?

Connect with top rated Experts

14 Experts available now in Live!

Get 1:1 Help Now