em vs pixel

It depends (sorry).

The basic difference -- what one considers when picking -- is that pixels are absolute in size and end are relative. Some cases call for pixels where we don't want our material resized. Other cases, we want things to resize so that the structure stays consistent as one resizes the browser.

John, thank you for your response. So it's best to use ems when coding responsively? I have also noticed percentages being used, are em's a preferred method over percentages? Thanks again!

Good question. I'm not quite at "responsive design" so hopefully an expert will weigh in. In the meantime, I'll try to clarify with an example and ask that you take my comments regarding responsive design with a grain of salt:

A block of text such as a paragraph can be thought of as a box -- the content -- with an offset and width. One would want the text and text affects (i.e. indentation, hanging punctuation) to work consistently relative to itself. This can be achieved easily with em. We then want a responsive design, so we use percentage for the width. However, we want precision for the offset to the content, so we use pixels.

The trick is knowing want will work best and when. Try looking at some websites and try to determine what they are doing, when they are doing it, why they are doing it, and if it is working.

It's making a bit more sense John, but what do you mean by offset?

Another consideration is that by using pixels and not ems, one is preventing a user from modifying the content via font size (i.e. control of design vs. accessibility).

Offset is the distance to the block from the edge or from the top left. The design may ask that this is a fixed width for aesthetic or practical reasons.

I wish I had a better example. If I come up with a better one, I will be certain to post it here.

Oh, that makes sense to me now! So basically the margins around the main content of the page. Thanks again for your input John!

I hate to go back on what I'd said, but I rather correct my mistakes than leave them:

I've been watching the new videos with Nick Pettit regarding Responsive Web Design and Testing, and I realized not only that what I said was not very useful for responsive design but also wrong. I also saw that there was a really, really good example of when one would want to use pixels.

The use of ems that I described -- fonts and things that use font sizes such as line spacing being relatively consistent -- makes sense. It can stay.

The width using percentages can stay too.

Margins using pixels for a responsive design doesn't really make sense. Most pages that I look at have the margins adjusting as the browser/screen size adjusts so that the content is always centered. This therefore should use a percentage.

What would use pixels is the minimum and maximum widths and the breakpoint values. Here, we need a measurement that corresponds to the device type: A width of 480px corresponds to the threshold between a regular smartphone and a tablet; a width of 85% corresponds to ... welll ... it doesn't correspond to anything; a width of 85em corresponds to ... uhm ... well ... it really depends on the font, and who wants to do a lot of math to calculate pixels when they can just use pixels.

I hope that makes things clearer. Sorry about that mistake.