Background image disappearing

Discussion in 'HTML' started by Nik Coughlin, Jun 22, 2006.

  1. Nik Coughlin

    Nik Coughlin Guest

    Hi,

    I have this page that I am working on about 3 column layouts with rounded
    corners, alpha etc.

    http://www.nrkn.com/3ColRoundAlpha/

    It's unfinished, but while testing I've noticed something strange. I have
    taken some screenshots to illustrate this:

    http://www.nrkn.com/3ColRoundAlpha/problem/

    The page looks like I expect it to under IE, Opera and Firefox (6/7,
    8.54/9b, 1.5) *locally*.

    Just in Firefox though, something weird happens. If I minimise and then
    restore Firefox while on the local copy of the page, all the parts of the
    page that have a png with alpha transparency become darker except for the
    png which is the background for the right-hand side of boxes, which looks
    normal.

    Now, if I upload the exact directory structure to my website and view it
    with *any* browser, the right-hand background mentioned above is missing
    entirely.

    Is it just me or does it look like that to everyone else too?

    Big WTF!

    First, what's this weird thing that FF is doing? Something to do with the
    gamma in the png or something? Weird.

    Second, what's different about the right-hand background? It doesn't
    trigger the gamma-bug thing mentioned above in FF and you can't see the
    background at all in any browser.
    Nik Coughlin, Jun 22, 2006
    #1
    1. Advertising

  2. Nik Coughlin

    dorayme Guest

    dorayme, Jun 22, 2006
    #2
    1. Advertising

  3. Nik Coughlin

    Nik Coughlin Guest

    dorayme wrote:
    > In article <e7d2cc$9ab$>,
    > "Nik Coughlin" <> wrote:
    >
    >> Is it just me or does it look like that to everyone else too?

    >
    > Looks like this to me on Safari (unwanted lines...)
    >
    > http://members.optusnet.com.au/hewajama/pics/3ColRoundAlpha.png


    That's not nice. I'll have to come back to that one. Do you also see the
    missing background image on the last two examples? It happens in *every*
    browser so it has to be my fault :p
    Nik Coughlin, Jun 22, 2006
    #3
  4. Nik Coughlin

    Nik Coughlin Guest

    dorayme wrote:
    > In article <e7d2cc$9ab$>,
    > "Nik Coughlin" <> wrote:
    >
    >> Is it just me or does it look like that to everyone else too?

    >
    > Looks like this to me on Safari (unwanted lines...)
    >
    > http://members.optusnet.com.au/hewajama/pics/3ColRoundAlpha.png


    That's not nice. I'll have to come back to that one. Do you also see the
    missing background image on the last two examples? It happens in *every*
    browser so it has to be my fault :p
    Nik Coughlin, Jun 22, 2006
    #4
  5. Nik Coughlin

    dorayme Guest

    In article <449a2403$>,
    "Nik Coughlin" <> wrote:

    > dorayme wrote:
    > > In article <e7d2cc$9ab$>,
    > > "Nik Coughlin" <> wrote:
    > >
    > >> Is it just me or does it look like that to everyone else too?

    > >
    > > Looks like this to me on Safari (unwanted lines...)
    > >
    > > http://members.optusnet.com.au/hewajama/pics/3ColRoundAlpha.png

    >
    > That's not nice. I'll have to come back to that one. Do you also see the
    > missing background image on the last two examples? It happens in *every*
    > browser so it has to be my fault :p


    Yes, there are missing bgs at various points...

    --
    dorayme
    dorayme, Jun 22, 2006
    #5
  6. Nik Coughlin wrote:
    > Hi,
    >
    > I have this page that I am working on about 3 column layouts with rounded
    > corners, alpha etc.
    >
    > http://www.nrkn.com/3ColRoundAlpha/
    >
    > It's unfinished, but while testing I've noticed something strange. I have
    > taken some screenshots to illustrate this:
    >
    > http://www.nrkn.com/3ColRoundAlpha/problem/
    >
    > The page looks like I expect it to under IE, Opera and Firefox (6/7,
    > 8.54/9b, 1.5) *locally*.
    >
    > Just in Firefox though, something weird happens. If I minimise and then
    > restore Firefox while on the local copy of the page, all the parts of the
    > page that have a png with alpha transparency become darker except for the
    > png which is the background for the right-hand side of boxes, which looks
    > normal.
    >
    > Now, if I upload the exact directory structure to my website and view it
    > with *any* browser, the right-hand background mentioned above is missing
    > entirely.
    >
    > Is it just me or does it look like that to everyone else too?
    >
    > Big WTF!
    >
    > First, what's this weird thing that FF is doing? Something to do with the
    > gamma in the png or something? Weird.
    >
    > Second, what's different about the right-hand background? It doesn't
    > trigger the gamma-bug thing mentioned above in FF and you can't see the
    > background at all in any browser.


    I don't see missing bg image or darkening, but I do see this:

    http://blinkynet.net/stuff/comp/nik1.jpg

    FF 1.5.0.1 / Linux

    And pretty much the same thing with Konqueror 3.4.2, except that fine
    horizontal line above the first line of that panel is not there.

    --
    Blinky RLU 297263
    Killing all posts from Google Groups
    The Usenet Improvement Project: http://blinkynet.net/comp/uip5.html
    Coming Soon: Filtering rules specific to various real news clients
    Blinky the Shark, Jun 22, 2006
    #6
  7. Nik Coughlin

    Nik Coughlin Guest

    Nik Coughlin wrote:
    > Hi,
    >
    > I have this page that I am working on about 3 column layouts with
    > rounded corners, alpha etc.
    >
    > http://www.nrkn.com/3ColRoundAlpha/
    >
    > It's unfinished, but while testing I've noticed something strange. I
    > have taken some screenshots to illustrate this:
    >
    > http://www.nrkn.com/3ColRoundAlpha/problem/
    >
    > Just in Firefox though, something weird happens. If I minimise and
    > then restore Firefox while on the local copy of the page, all the
    > parts of the page that have a png with alpha transparency become
    > darker except for the png which is the background for the right-hand
    > side of boxes, which looks normal.
    >
    > Now, if I upload the exact directory structure to my website and view
    > it with *any* browser, the right-hand background mentioned above is
    > missing entirely.


    OK, the missing background... that was just dumb. I'd mistyped the file
    name in the CSS file as image1r.png instead of Image1r.png. My local
    system, case insensitive, my webserver, case sensitive. That should have
    been the first thing I thought of, damn fool :p

    Now I have to get rid of those little 1px gaps, and if possible figure out
    WTF is up with Firefox changing the gamma of my PNGs when I alt-tab or
    minimise/maximise the window.
    Nik Coughlin, Jun 22, 2006
    #7
  8. Nik Coughlin

    Nik Coughlin Guest

    Blinky the Shark wrote:
    > Nik Coughlin wrote:
    >> Hi,
    >>
    >> I have this page that I am working on about 3 column layouts with
    >> rounded corners, alpha etc.
    >>
    >> http://www.nrkn.com/3ColRoundAlpha/
    >>
    >> It's unfinished, but while testing I've noticed something strange.
    >> I have taken some screenshots to illustrate this:
    >>
    >> http://www.nrkn.com/3ColRoundAlpha/problem/
    >>

    *snip*
    >
    > I don't see missing bg image or darkening, but I do see this:
    >
    > http://blinkynet.net/stuff/comp/nik1.jpg


    Yep, supposed to do that, it's illustrating why a particular layout
    technique doesn't work :)

    > FF 1.5.0.1 / Linux
    >
    > And pretty much the same thing with Konqueror 3.4.2, except that fine
    > horizontal line above the first line of that panel is not there.


    I fixed the issues I was having so I'm getting on to the fine line that
    appears in a couple of browsers now.
    Nik Coughlin, Jun 23, 2006
    #8
  9. Nik Coughlin

    Nik Coughlin Guest

    Nik Coughlin wrote:
    > Hi,
    >
    > I have this page that I am working on about 3 column layouts with
    > rounded corners, alpha etc.
    >
    > http://www.nrkn.com/3ColRoundAlpha/
    >
    > It's unfinished, but while testing I've noticed something strange. I
    > have taken some screenshots to illustrate this:
    >
    > http://www.nrkn.com/3ColRoundAlpha/problem/
    >

    *snip*

    I already posted to say that I had a typo in my CSS, case sensitivity was
    why the bg image wasn't displaying.

    As to the gamma of pngs going all dark sometimes when I switched away from
    Firefox to another app and then back, I fixed that just by stripping all of
    the gamma information out of the pngs using pngcrush -rem gAMA.

    Now just that fine line to fix.
    Nik Coughlin, Jun 23, 2006
    #9
  10. Nik Coughlin

    dorayme Guest

    In article <>,
    "Nik Coughlin" <> wrote:

    > OK, the missing background... that was just dumb. I'd mistyped the file
    > name in the CSS file as image1r.png instead of Image1r.png. My local
    > system, case insensitive, my webserver, case sensitive. That should have
    > been the first thing I thought of, damn fool :p


    perhaps you need to check again to see the whole page... in the
    middle of the page is still a missing bg... in Safari at least...
    If you can't see or are not sure where, come back again and I
    will detail more

    --
    dorayme
    dorayme, Jun 23, 2006
    #10
  11. Nik Coughlin

    Nik Coughlin Guest

    dorayme wrote:
    > In article <>,
    > "Nik Coughlin" <> wrote:
    >
    >> OK, the missing background... that was just dumb. I'd mistyped the
    >> file name in the CSS file as image1r.png instead of Image1r.png. My
    >> local system, case insensitive, my webserver, case sensitive. That
    >> should have been the first thing I thought of, damn fool :p

    >
    > perhaps you need to check again to see the whole page... in the
    > middle of the page is still a missing bg... in Safari at least...
    > If you can't see or are not sure where, come back again and I
    > will detail more


    Hi, one of the layout techiques listed on that page fails under certain
    circumstances and there is a demonstration of it failing on the page, so one
    of them is *supposed* to look broken, is it the one directly above "Using a
    table to automatically grow the columns"?

    Thanks!
    Nik Coughlin, Jun 23, 2006
    #11
  12. Nik Coughlin wrote:
    > Blinky the Shark wrote:


    >> I don't see missing bg image or darkening, but I do see this:
    >>
    >> http://blinkynet.net/stuff/comp/nik1.jpg

    >
    > Yep, supposed to do that, it's illustrating why a particular layout
    > technique doesn't work :)


    I've been had! :)

    --
    Blinky RLU 297263
    Killing all posts from Google Groups
    The Usenet Improvement Project: http://blinkynet.net/comp/uip5.html
    Coming Soon: Filtering rules specific to various real news clients
    Blinky the Shark, Jun 23, 2006
    #12
  13. Nik Coughlin

    dorayme Guest

    In article <e7fbtm$tbt$>,
    "Nik Coughlin" <> wrote:

    > dorayme wrote:
    > > In article <>,
    > > "Nik Coughlin" <> wrote:
    > >
    > >> OK, the missing background... that was just dumb. I'd mistyped the
    > >> file name in the CSS file as image1r.png instead of Image1r.png. My

    >> ... in the
    > > middle of the page is still a missing bg... in Safari at least...
    > > If you can't see or are not sure where, come back again and I
    > > will detail more

    >
    > Hi, one of the layout techiques listed on that page fails under certain
    > circumstances and there is a demonstration of it failing on the page, so one
    > of them is *supposed* to look broken, is it the one directly above "Using a
    > table to automatically grow the columns"?
    >


    Yes, you are right... as usual, I was not paying full
    attention... now your lines only to be fixed eh....

    --
    dorayme
    dorayme, Jun 23, 2006
    #13
  14. Nik Coughlin

    Nik Coughlin Guest

    Blinky the Shark wrote:
    > Nik Coughlin wrote:
    >> Blinky the Shark wrote:

    >
    >>> I don't see missing bg image or darkening, but I do see this:
    >>>
    >>> http://blinkynet.net/stuff/comp/nik1.jpg

    >>
    >> Yep, supposed to do that, it's illustrating why a particular layout
    >> technique doesn't work :)

    >
    > I've been had! :)


    Was it good?
    Nik Coughlin, Jun 23, 2006
    #14
  15. Nik Coughlin

    Nik Coughlin Guest

    dorayme wrote:
    > In article <e7fbtm$tbt$>,
    >>> In article <>,
    >>> "Nik Coughlin" <> wrote:
    >>>> OK, the missing background... that was just dumb.

    *snip*
    > Yes, you are right... as usual, I was not paying full
    > attention... now your lines only to be fixed eh....


    Yeah bastard lines. Not too bothered, have had that before and fixed it.
    Something to do with line-height I believe. Will have to dig up some old
    projects.
    Nik Coughlin, Jun 23, 2006
    #15
  16. Nik Coughlin wrote:
    > Blinky the Shark wrote:
    >> Nik Coughlin wrote:
    >>> Blinky the Shark wrote:

    >>
    >>>> I don't see missing bg image or darkening, but I do see this:
    >>>>
    >>>> http://blinkynet.net/stuff/comp/nik1.jpg
    >>>
    >>> Yep, supposed to do that, it's illustrating why a particular layout
    >>> technique doesn't work :)

    >>
    >> I've been had! :)

    >
    > Was it good?


    Reasonably.

    --
    Blinky RLU 297263
    Killing all posts from Google Groups
    The Usenet Improvement Project: http://blinkynet.net/comp/uip5.html
    Coming Soon: Filtering rules specific to various real news clients
    Blinky the Shark, Jun 23, 2006
    #16
  17. Nik Coughlin

    dorayme Guest

    In article <449b78c4$>,
    "Nik Coughlin" <> wrote:

    > dorayme wrote:
    > > In article <e7fbtm$tbt$>,
    > >>> In article <>,
    > >>> "Nik Coughlin" <> wrote:
    > >>>> OK, the missing background... that was just dumb.

    > *snip*
    > > Yes, you are right... as usual, I was not paying full
    > > attention... now your lines only to be fixed eh....

    >
    > Yeah bastard lines. Not too bothered, have had that before and fixed it.
    > Something to do with line-height I believe. Will have to dig up some old
    > projects.


    Look, I must say, Nik... it is not too bad an exercise... if I
    ever want rounded corners - or indeed other sorts of corners - I
    will take a bigger look at what you are doing. I get the general
    idea though...

    (I would drop all to study corners that leave the 2 dimensions
    and enter some third or even fourth one...)

    --
    dorayme
    dorayme, Jun 23, 2006
    #17
    1. Advertising

Want to reply to this thread or ask your own question?

It takes just 2 minutes to sign up (and it's free!). Just click the sign up button to choose a username and then you can ask your own questions on the forum.
Similar Threads
  1. Raydog
    Replies:
    3
    Views:
    22,206
    Raydog
    Apr 9, 2004
  2. dalerguy_home

    layer background-images disappearing

    dalerguy_home, Feb 23, 2004, in forum: HTML
    Replies:
    5
    Views:
    737
    Toby A Inkster
    Feb 25, 2004
  3. jc
    Replies:
    3
    Views:
    1,728
  4. jc
    Replies:
    1
    Views:
    1,367
    Neredbojias
    Mar 19, 2008
  5. Dj Frenzy
    Replies:
    3
    Views:
    308
    Robert
    Feb 10, 2004
Loading...

Share This Page