Grow your CSS skills. Land your dream job.

FF ~vs~ IE Padding

  • # March 18, 2009 at 11:05 am

    Greetings!

    I’ve been trolling here for a while & just decided to join… naturally, having a question, so here goes.

    I’m creating a site for a non-prof client (Church) and am having a headache over a padding issue.

    Here’s the dealio:

    url: http://www.unioncitycc.org/main1a.html
    Validates per W3C validator

    I’ve created a div containing only a script for a date stamp, and a repeating background image. (Simple enough) The div is relative positioned, with the content of the div (date script) set with text-align: right, and a padding of 20px.

    My issue is that FF displays the datescript with a 20px padding from the right… just as I intend… and IE spills the div outside of the wrapper 20px.

    I’m open to suggestions…

    Thank y’all!
    DD

    # March 18, 2009 at 2:05 pm

    Although it doesn’t resolve the issue by allowing the script to be displayed 20px from the right in IE, it does prevent the div from spilling out of the wrapper 20px to the right in IE.

    I experimented & finally landed on adding this to the div css:
    * padding: 0;

    Now it displays as intended in FF, while just hugging the right edge of the div in IE. At least it isn’t hanging over the edge as before.

    Anyone else?

    # March 19, 2009 at 7:19 am

    Try adding your padding to the content of the div and not the div itself.

    # March 19, 2009 at 10:26 am

    Rock on!

    Per your suggestion, I simply added the desired padding to the script within the div… viola!

    Thanks for the help Apostrophe… much appreciated.

    Regards
    DD

Viewing 4 posts - 1 through 4 (of 4 total)

You must be logged in to reply to this topic.

*May or may not contain any actual "CSS" or "Tricks".