CSS3

At the most basic level, why even use CSS? What does it do for us, as compared to the ‘old’ way of coding? I’m looking for a theoretical understanding of the separation between a document’s markup/content and its styling.

  • What’s the difference between an inline element and a block element?
  • What are some ways you might target IE (or IE6) only, without affecting other browsers?
  • How do CSS precedence/cascading rules work? How does the !important directive affect the rules?
  • Have you ever used a CSS reset? (e.g. the * reset, or the YUI Reset)? Why are they useful?
  • Have you ever played with any of the advanced selectors (e.g. selecting children or selecting siblings)? Or with any of the psuedo-selectors (:hover, etc.)? Note that these are only supported in modern browsers, and so it is not common for people to be familiar with them, but if they are it’s a good sign.
  • What are some different ways for specifying a color (e.g. #ffffff, white, #fff & rgb(255,255,255))?
  • What about different lengths? Pixels, ems, & pts are all common.
  • t’s frequently worth asking some basic text questions; e.g. how to increase/decrease text size, make a font bold (without using the tag!), adjust line-height, etc.
  • Explain how the CSS box model works. Draw a box and then explain what the border is, what the margin is, what the padding is, etc.? If you assign a width: or height: to something, what specifically does that refer to?
  • Explain vertical margin collapsing.
  • How do you float an element, and what does that mean? What’s clearing?
  • What’s the difference between position: relative, position: fixed & position: absolute?
  • What does z-index do? Advanced question: what are some of the issues with IE6 and z-index?
  • What does it mean for your CSS to ‘gracefully degrade’ across browsers? What are some techniques for achieving graceful degradation? Have you had any experience with newer CSS versions, such as CSS3?