treehouse : what would you like to learn today?
Web Design Web Development iOS Development

Negative Padding and Margins

  • Hey all,

    I know its not techically correct, but I was curious, is there any problem with using Negative Padding or margins in sites? like will it break the design in some browsers?
  • Negative margins are usually fine, IE6 will often throw up its usual idiosyncrasies with its box-model quirks. Negative Padding however is not allowed so don't use it.

    There's a decent box-model article here http://www.w3.org/TR/CSS21/box.html
  • "box" said:
    Negative margins are usually fine, IE6 will often throw up its usual idiosyncrasies with its box-model quirks. Negative Padding however is not allowed so don't use it.

    There's a decent box-model article here http://www.w3.org/TR/CSS21/box.html



    thanks for the advice, just curious though, what is so wrong with Negative padding?
  • Margin can position an element, so applying negative margin will pull the object to that negative position. Padding however doesn't position an element, it merely creates space around that element, so negative padding would be negative space.
    To visualise, imagine you have an image of 100px x 150px, you can't remove padding from it, it must exist at a minimum of 100px x 150px - you can only add the padding.
    Hope that makes sense - I know what I mean anyway lol
  • thanks it made sense :-)
  • Just one other question on this topic. does anyone know if there is any way to make this work in IE6 and earlier? currently the element only shows up in its correct position in Firefox, safari and IE7