1. This site uses cookies. By continuing to use this site, you are agreeing to our use of cookies. Learn More.

Can't use negative margin to expand width of sectionHeaders?

Discussion in 'XenForo Development Discussions' started by Jaxel, Feb 11, 2011.

  1. Jaxel

    Jaxel Well-Known Member

    This is a general HTML CSS problem...

    This is the default...

    If I add the following code:
    margin: -10px -10px 10px;
    It becomes this:

    You would think that by adding those margins it would extend the width a total of 20px. Instead it simply moves the margin -10 to the left, and completely fails to extend the margin -10 to the right. Why is this happening and how do I get around this?

    You can see this live on my website if you want to tinker with firebug or inspector...
  2. GofD

    GofD Well-Known Member

    You've got:
    padding: 10px 0;
    - change it to
    padding: 10px;
    and it should work.
  3. Jaxel

    Jaxel Well-Known Member

    Where do I have this padding?
  4. GofD

    GofD Well-Known Member

    Sorry - it's in the same sectionHeader

    .EWRporta_Portal #recentThreads .sectionHeaders {
    blah, blah, blah:
    padding: 10px 0;

    Change that to padding: 10px;
  5. Jaxel

    Jaxel Well-Known Member

    That doesn't fix it. Besides, padding wouldn't have anything to do with this issue. The issue is OUTSIDE of the box (margin), not INSIDE of the box (padding).
  6. TazDevilLooney

    TazDevilLooney Active Member

    margin: -10px 20px 0px -10px;
    If you take 10 away you must add a extra 10
  7. Jaxel

    Jaxel Well-Known Member

    Trust me... I tried all this, none of it fixed it. What I did was remove the padding of the outer container and simply added margins manually to the OTHER objects in the container.
  8. TazDevilLooney

    TazDevilLooney Active Member

    Im glade you go it sorted out jaxel. [​IMG]

Share This Page