Firefox bug (background no-repeat?) + Chrome borders bug

Resolved sashka76
(@sashka76)

6 years ago
There seems to be a bug in your Cool Tag Cloud widget. For some tags it puts like an underline (of the tag background colour) below the tag box — in Firefox at least. If you disable the CSS below, the background with the “underline” disappears.

.cool-tag-cloud .ctcsilver .ctcleft a, .cool-tag-cloud .ctcsilver .ctcleft .tag-cloud-link {
background: url(images/silver-left.png) no-repeat !important;
}

P. S. Btw, it would be cool to allow no background and no image. Basically I like the way it looks with the above CSS disabled 🙂

P. P. S. By the way, in latest Chrome it’s a different problem: in cuts the edges occasionally (initially or on hover). See tag “C. J. Dennis” for both buggy occurrences.
- This topic was modified 6 years ago by sashka76.
- This topic was modified 6 years ago by sashka76.
- This topic was modified 6 years ago by sashka76.
- This topic was modified 6 years ago by sashka76.
The page I need help with: [log in to see the link]

Viewing 6 replies - 1 through 6 (of 6 total)

Plugin Author WPKube
(@wpkube)

6 years ago

Hi @sashka76

Did you zoom in the browser? I don’t see the issue in regular view but when I zoom in I do see it.

Thread Starter sashka76
(@sashka76)

6 years ago

Right, Chrome problem was with the zoom only.

But more important one (Firefox) has a normal zoom. Something the way Firefox renders shadows? In fact, that extra line shows in any zoom. It disappears when you hover over the button (after animation).
Thread Starter sashka76
(@sashka76)

6 years ago
Ok, I get it. It is the upper border of the lower (lighter coroured) box

In here (cool-tag-cloud.css):

.cool-tag-cloud .ctcleft a,
.cool-tag-cloud .ctcleft .tag-cloud-link {
…
height: 25px!important;
…
}

if you change height to, say, 30px, you’ll see more of the second box. Changing it to 24px gets rid of the “extra line”. However, on hover everything bumps down slightly…

Or, perhaps, you can change the background images (like cool-tag-cloud/inc/images/silver-left.png). E.g. move the bottom box down one pixel (don’t know how it’ll impact the whole thing though).
- This reply was modified 6 years ago by sashka76.
- This reply was modified 6 years ago by sashka76.
- This reply was modified 6 years ago by sashka76.
- This reply was modified 6 years ago by sashka76.
Plugin Author WPKube
(@wpkube)

6 years ago

Hi @sashka76

It’s an image/graphic which is 50px tall, the top 25px is meant to show by default and the bottom 25px shows up on hover with an animation.

The 2nd box starts as of the 26th pixel so it shouldn’t be visible. When the browser is zoomed in our out the browser has to round up or down some numbers when rendering which could cause the issue, but without zoom it should all be exact to the pixel.

I don’t see the issue with no zoom in Firefox, it shows up only after I zoom in.

Can you send over a screenshot of the issue, you can upload to imgur.com, it might help me understand what causes it.

Thread Starter sashka76
(@sashka76)

6 years ago

I just realised that while my Firefox has no scaling, my general resolution setting is 150% scale. So if you see no such problem, forget it. All is good.

Plugin Author WPKube
(@wpkube)

6 years ago

Hi @sashka76

I tried setting the resolution scaling to 150% and do the the issue. It’s similar to zooming in the browser itself, the calculations round up or down and offsets happen.

Do you think many of your visitors zoom in (scale up)? If that’s the case I’ll try to figure out a solution.

Viewing 6 replies - 1 through 6 (of 6 total)

The topic ‘Firefox bug (background no-repeat?) + Chrome borders bug’ is closed to new replies.