Results 1 to 3 of 3

Thread: IE vs FireFox Border Display

  1. #1
    Join Date
    Aug 2007
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default IE vs FireFox Border Display

    I have defined an outer container called outer in a css style sheet with a border of
    #outer {
    border-width: 3px;
    border-style: ridge;
    border-color:blue;
    }

    In IE, the border frames the entire contents, but in Firefox, the border just creates a small box at the top of teh screen. I don't know if it is a CSS problem, or if Firefox is somehow not recognizing the <div>, </div> properly.

    The html is at http://ourultimatewedding.com/index.htm.
    The style sheet is http://ourultimatewedding.com/styles/style1.css

    Appreciate any help or suggestions.

    Also, in IE the border around the Footer does not display the top border. In Firefox, it displays the border around the entire Footer.

    Is it a possible margin problem where the <div> above the footer is over top of the border?

    Thanks.

  2. #2
    Join Date
    Mar 2006
    Location
    Cleveland, Ohio
    Posts
    574
    Thanks
    6
    Thanked 5 Times in 5 Posts

    Default

    Try setting #outer's width and height to auto:

    Code:
    #outer{
    width: auto;
    height: auto;
    border: 3px blue ridge;}
    I also looked at the site in IE, and I don't see any border issues with the footer.
    Thou com'st in such a questionable shape
    Hamlet, Act 1, Scene 4

  3. #3
    Join Date
    Aug 2007
    Posts
    2
    Thanks
    0
    Thanked 0 Times in 0 Posts

    Default

    Thanks for the tip, however that did not solve the problem in IE. It is apparently a bug in Firefox with nested <Divs>, that I solved by submitting the following:
    #outer:after { content: ""; display: block; height: 0; clear: both; }

Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •