Chunk, error in header visualization on Chrome
-
Hi there!
I wanted to know why my Chrome renders in this awful way the header of my blog:
– https://skitch.com/koolinus/gahug/informazioni-su-google-chromeSafari, or Firefox (and even old versions of Chrome on Mac) render it well:
– https://skitch.com/koolinus/gahwj/safariI’ve seen this rectangular gradient happear everytime (instead) on Windows. Can you help me to solve this?
TIA,
NicolaThe blog I need help with is: (visible only to logged in users)
-
That is interesting. The gradient at the top is an RGBA CSS gradient with two declarations, one for moz and one for webkit, and Chrome is a webkit based browser so it should render it cleanly. It looks like the version of Chrome you are using is a DEV release, not a stable release, is that correct?
-
-
Interesting. I just downloaded Chrome and checked 3 client sites where I use CSS linear gradients and they are b0rked as well. The CSS is solid and compliant so that is not the issue. This appears to be a “webkit” issue from a little online searching and supposedly affects Safari as well though I’m not seeing it in Safari on any of the sites I have CSS linear gradients on, only in Chrome.
It could be that Safari has updated to a fixed version of webkit where Chrome has not.
Google seems more concerned with releasing a new version number every other day than they do about fixing bugs, which is why I’ve “strongly” recommended my clients use Firefox instead.
-
I may have found a fix, but it will only work if you had the Custom Design Upgrade. Basically you set a height and width for the body element in the CSS such as below:
body { height: 100%; width: 100%; }I’ve not tried this, but some are saying it works.
You might try adding that to appearance > custom design > CSS and using the preview in Chrome to see it it takes care of the issue.
-
Hi Richard!
Thanks for your investigations!!! The strangest thing is that I’m using DEV builds of Chrome everywhere (Mac, Linux, Windows I mean) and this is the 1st time that this happened on a Mac desktop.Since now, in fact, I thought it was a problem with M$ stuff …
-
Here I am again …. I tried with the option of simply adding/including those 4 lines of code but this was the result:
– http://skitch.com/koolinus/ga7h4/schermata-01-2455938-alle-20.38.02:-(
-
Hmmm, people were saying that was working, but it could be that there are reasons that won’t work on a wordpress theme. I wasn’t able to look at the sites they said it was working on.
Try this
body, html { width:100%; height:100%; } -
The 100% solution that would work everywhere would be to create a PNG image with transparency and a gradient to match what is there and then put that in as a background image and do a repeat horizontally on it. The image would be perhaps 10px wide by 80px tall and make sure that the background is set to transparent when you save it.
-
Hi guys!
With today’s update of the dev release of Chrome things have gone back to normality and I can see the CSS right … see yourself:<div class=”thumbnail”><img style=”max-width:638px” src=”https://img.skitch.com/20120125-k2ucp7uqqaf9r54fdsgciqfbfx.medium.jpg” alt=”Informazioni su Google Chrome” />
<span>Uploaded with Skitch!</span></div> -
Interesting, it’s no long the flat, single color stripes, but for me it’s still a striped gradient and not smooth at all. (screenshot)
Yes, Chrome updated itself yesterday.16.0.912.77m
- The topic ‘Chunk, error in header visualization on Chrome’ is closed to new replies.