Ugly gray background box on refresh
-
On refresh of my site there is an ugly gray background behind the image on the left in the header (no such problem on the right). Went through my CSS file and took out any color that wasn’t one of my colors, still there.
Any ideas? And is there any benefit to replacing my images with png files? The original template used jpgs and gifs so, knowing nothing at the time (a big three weeks ago), I followed suit.
-
Hi, betsyg.
I can not currently see it in either IE7 or Firefox. Try clearing your browser cache and retesting.
is it a PNG image? if so, you might be using IE6 which has incredibly poor support for PNG transparency.
this is sort-of fixable, but not really for backgrounds, unfortunately.
No, I’m using IE7, and it’s a jpg.
I had tried clearing cache, but I didn’t want to close out all my explorer windows because I have a gazillion things open, so I tried it on my desktop, clearing cache, clearing history, closing explorer, opening, and still see ugly gray box. I know explorer cache is a pain to clear (getting your new favicon to show up is miserable) so maybe it’s just that, if you’re not seeing it. No background at all behind the porch picture when you hit refresh?
Firefox doesn’t seem to go through as much agony to refresh, so I’m not seeing it there (images don’t even bother to repaint).
Tried again, clearing cache, history, and even rebooting…still there.
Hi, Betsy. I see it just briefly right before the lovely watercolor image loads. But it’s just a split second. The watercolor image on the left loads pretty much immediately and there’s no dark gray box. I have looked in Opera 9.24, IE6, IE7 and Firehog 2.0.0.4. Did you manage to fix the problem?
Hi Joni,
I didn’t fix it, and I definitely see a dark gray background on both my computers (yes, just for a second, but why at all?). If you look at the logo side of the header (a separate image) there is no such flash of gray, just a plain white background.
Maybe I wasn’t clear that it is just there as the page repaints and as soon as the jpg appears you don’t see it anymore. To my eye, it’s really awful, but even worse so because there’s doesn’t appear to be any good reason for it and it doesn’t happen on the other image. (I desire beauty and logic, despite those ugly sidebars I have to redo for the 1000th time…)
Thanks, I mean, if I have to accept it, I’ll accept it, but I’d rather not if I can figure out why it’s happening. Maybe I should nose around the header template. (Just occrued to me the template used custom image headers for the left/problem image, whereas I placed the image myself on the right…the sole difference between the two…hmmmm)
Okay, I looked at your image paths. The left image, the watercolor, is NOT part of your theme design; at least, it’s not in the theme folder. Are you by chance using flash or something to serve that image? B/c that could be why you see that annoying bit of gray.
Yeah, unless you want to go ahead and place that image into your theme folder and call it from your stylesheet. That can be done, no reason why not. And you can always swap it out anytime you like by just changing the image there. If you need the code for that I can get that for you.
I’m not using flash (that I know of) but I did use “Custom Image Header” to get that image in place. I believe the Custom Image Header function puts it in your uploads directory. In any case, I think that has to be the problem, because otherwise everything else looks the same in the CSS.
Dang, I should be able to figure out how to do that…I’m editing plugins at this point (only fried it three times before I got what I wanted…not bad).
(Hope you’ll come back to my site when it’s up…Should be a fun read. Shooting now for June 9–have to sort out the whole RSS world, which is almost as confusing as editing WP themes…)
Will post if it works, otherwise, argh, and oh well.
I too am seeing some weird, conflicting things in your css.
This is what I see, although I’m not sure where you made the modification.
#topi {thebetsygspot.com (line 30)
background:#333333 url(http://thebetsygspot.com/wp-content/uploads/2008/05/housewatercolr2.jpg) no-repeat scroll 0pt;
height:131px;
width:576px;Could the background color #333333 be the source of your symptom?
ok, after shooting off the cuff earlier… I decided to actually look at the site this time.
in your style.css, look for a definition for #topi. It seems the background colour #333 is specified in there, perhaps on the same line as the image URL.
this may not be part of your theme’s style.css if your header image plugin has its own css file that comes with it…. or alternately if that plugin puts the background in with inline style attributes…
either way, #topi is what you’re looking for.
CJ, don’t you have some womanizing you should be doing instead of beating me to posting? π
(hangs head in shame)
…sorry boss.lol
Dang again. I cleared the custom image header, put my own image in just the normal head.jpg place in the theme’s image folder, and it’s still doing the stupid #333, which is NOT in the theme’s CSS file (the only CSS file, as that was the first thing I took out before I posted. I’m going to have to go through every one of this guy’s php files and see where he put background color. I’ll hunt that down if it kills me…
I did see the #333 in the source after Joni’s post and it’s clear I have to figure out how that’s getting generated. Will report on mystery when solved.
Can I make a small suggestion?
I think maybe after all this digging and hunting, you have graduated to inserting your image into your header via your style.css yourself.
Time to turn off that plugin, and not worry about digging through the php file looking for inline styles.
You have the power. You go girl, and all that stuff.
The topic ‘Ugly gray background box on refresh’ is closed to new replies.