dcsimg
www.webdeveloper.com
Results 1 to 4 of 4

Thread: background position problem in Firefox

  1. #1
    Join Date
    Feb 2006
    Posts
    18

    background position problem in Firefox

    I'm having problems centering a background image. When I use the background position attribute in CSS, it comes out looking perfect on Internet Explorer, but comes out messed up in Firefox. Let me show you:
    http://img97.imageshack.us/img97/306...mpleba0.th.gif
    http://img244.imageshack.us/img244/9...mplecz6.th.gif

    Does anybody know how I can fix this problem? Here's my code:

    Code:
    body {background-color: #ebebeb;
    background-image: url("midnight_background.gif");
    background-repeat: no-repeat;
    background-position: 50% 50%;
    padding: 0%;
    margin: 0%;
    font-family: lucida sans;
    font-size: 10pt;
    color: #000000;}

  2. #2
    Join Date
    Jul 2005
    Location
    USA
    Posts
    3,910
    Believe it or not, it's supposed to do that.

    Add this to your stylesheet:
    Code:
    html, body {
      padding: 0;
      margin: 0;
      height: 100%;
    }
    Please don't cross-post.

    Edit: Link to other thread removed because it's been deleted.
    Last edited by Kravvitz; 08-19-2006 at 05:30 PM.
    Learn CSS. | SSI | PHP includes | X/HTML Validator | CSS validator | Dynamic Site Solutions

    Design/program for Firefox (and/or Opera), apply fixes for IE, not the other way around.

    Check out my blog.

  3. #3
    Join Date
    Feb 2006
    Posts
    18

    Post

    Sorry about cross-posting, I didn't realize there was a CSS forum. But your fix did work. Do you know of any resources that details the differences in IE and FF CSS standards? I found a few (www.positioniseverything.net), which details IE bugs in CSS. Thanks for your help.

  4. #4
    Join Date
    Jul 2005
    Location
    USA
    Posts
    3,910
    You're welcome

    PIE does have some of the best articles on that.

    You might also find some of the pages listed under "Positioning and Layout Techniques" on this page helpful.

    Edit: You can also look through the bug reports on QuirksMode. You may want to check out the many helpful articles on QuirksMode as well.
    Last edited by Kravvitz; 08-19-2006 at 09:24 PM.
    Learn CSS. | SSI | PHP includes | X/HTML Validator | CSS validator | Dynamic Site Solutions

    Design/program for Firefox (and/or Opera), apply fixes for IE, not the other way around.

    Check out my blog.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles