SitePoint Sponsor

User Tag List

Results 1 to 16 of 16
  1. #1
    SitePoint Enthusiast jeffbax's Avatar
    Join Date
    Jun 2003
    Location
    New Jersey
    Posts
    92
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    Nested Divs and background images in Mozilla?

    Alright, I'm having a few problems with Mozilla having a div's background image *show through* to ones nested inside of it.

    I know my code might be a bit sloppy, but it works in Opera and IE 6, but in Mozilla while it positions correctly (except for a top margin I can't seem to understand)

    The background image does not repeat.

    See here

    http://www.pvgalaxy.com/template11.html

    Works right in Opera / IE but not Mozilla, any ideas?
    Last edited by jeffbax; Jul 6, 2003 at 17:32.

  2. #2
    SitePoint Addict hurricane.uk's Avatar
    Join Date
    May 2003
    Location
    Liverpool
    Posts
    361
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The default value for background(-color) is transparent, so try adding background-color: foo; to the nested divs.

  3. #3
    SitePoint Enthusiast jeffbax's Avatar
    Join Date
    Jun 2003
    Location
    New Jersey
    Posts
    92
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I dont need colors to show, I need the background image of one of the parent divs to show through to the child, and in Moz it isn't due to the amount of nests I have I guess.

  4. #4
    SitePoint Addict hurricane.uk's Avatar
    Join Date
    May 2003
    Location
    Liverpool
    Posts
    361
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Ah, right, I misread your question and assumed you didn't want the bg showing through.

    Have you tried background-image: inherit; ?

  5. #5
    SitePoint Enthusiast jeffbax's Avatar
    Join Date
    Jun 2003
    Location
    New Jersey
    Posts
    92
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by hurricane.uk
    Ah, right, I misread your question and assumed you didn't want the bg showing through.

    Have you tried background-image: inherit; ?
    Not yet, will now.

  6. #6
    SitePoint Enthusiast jeffbax's Avatar
    Join Date
    Jun 2003
    Location
    New Jersey
    Posts
    92
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    No Dice

  7. #7
    SitePoint Addict hurricane.uk's Avatar
    Join Date
    May 2003
    Location
    Liverpool
    Posts
    361
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    The only other thing I can suggest is to explicitly state background: transparent; for the nested divs.

  8. #8
    SitePoint Member
    Join Date
    Jul 2003
    Location
    Florida
    Posts
    1
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I have a similiar problem. The only way I've been able to fix it so far is to change my doctype to html loose. Although I would like to keep it xhtml and I do plan on finding the better solution, at least it works for now.

  9. #9
    SitePoint Guru bronze trophy blufive's Avatar
    Join Date
    Mar 2002
    Location
    Manchester, UK
    Posts
    853
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Right, first off: somewhere in that lot, you lost count of your </div> tags. You have one more close than open, probably at the end. This *might* be the cause of your problem - different parsers deal with mis-nested tags differently.

    Second Up, what versions of IE/Opera? Here, Opera 7 matches Mozilla Firebird 0.6, and IE6 is the odd one out.
    Last edited by blufive; Jul 7, 2003 at 14:07.

  10. #10
    SitePoint Enthusiast jeffbax's Avatar
    Join Date
    Jun 2003
    Location
    New Jersey
    Posts
    92
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    I'm using Opera 7 , IE 6, and Mozilla Firebird 0.6

    Extra div closing? hmmm... I can't seem to spot it?

  11. #11
    SitePoint Enthusiast jeffbax's Avatar
    Join Date
    Jun 2003
    Location
    New Jersey
    Posts
    92
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Found it, remarkable, leme upload the new vers, maybe you can tell me how to fix the big top margin in mozilla and IE ?

  12. #12
    SitePoint Enthusiast jeffbax's Avatar
    Join Date
    Jun 2003
    Location
    New Jersey
    Posts
    92
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    http://www.pvgalaxy.com/template12.html

    Validates as XHTML Strict, but Now I have to deal with these terrible top margins in IE6 and Mozilla, but not opera

  13. #13
    SitePoint Enthusiast jeffbax's Avatar
    Join Date
    Jun 2003
    Location
    New Jersey
    Posts
    92
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Alright try this

    http://www.pvgalaxy.com/template13.html

    Validates, and no wierd top margin in any browser, BUT I had to set body margin to -20px.

    Is that a bad thing to do?

    *edit*

    NM, the margin in Opera is fubar now

  14. #14
    SitePoint Enthusiast jeffbax's Avatar
    Join Date
    Jun 2003
    Location
    New Jersey
    Posts
    92
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Haha, nm, I had a <pre> thing to make a page bookmark for the "to top" link, but it was pushing the page down!

    Turns out I didn't even need to define one O_o

  15. #15
    SitePoint Enthusiast jeffbax's Avatar
    Join Date
    Jun 2003
    Location
    New Jersey
    Posts
    92
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Last edited by jeffbax; Jul 7, 2003 at 18:29.

  16. #16
    gingham dress, army boots... silver trophy redux's Avatar
    Join Date
    Apr 2002
    Location
    Salford / Manchester / UK
    Posts
    4,838
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Quote Originally Posted by jeffbax
    http://www.pvgalaxy.com/template12.html

    Validates as XHTML Strict, but Now I have to deal with these terrible top margins in IE6 and Mozilla, but not opera
    i was going to say: set both margin and padding to 0 in your CSS...however, i went to that page and can't seem to see any unsightly margins (unless i'm missing something)
    re·dux (adj.): brought back; returned. used postpositively
    [latin : re-, re- + dux, leader; see duke.]
    WaSP Accessibility Task Force Member
    splintered.co.uk | photographia.co.uk | redux.deviantart.com


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
  •