Closed
Bug 416124
Opened 17 years ago
Closed 12 years ago
Background paint with -moz-border-colors leaks through the 'transparent' lines.
Categories
(Core :: Layout, defect)
Core
Layout
Tracking
()
RESOLVED
FIXED
People
(Reporter: alfredkayser, Unassigned)
Details
Attachments
(4 files)
With -moz-border-colors, one can have (semi)transparent lines in the border, like:
border: 5px solid;
-moz-border-top-colors: transparent transparent blue red;
-moz-border-left-colors: transparent transparent blue red;
-moz-border-right-colors: transparent transparent blue red;
-moz-border-bottom-colors: transparent transparent blue red;
It is unclear what should then happen with the background painting for those lines. Shrinking the background clip area to exclude the border would solve above case. But not the below case:
-moz-border-top-colors: blue red transparent transparent;
Even more, what needs to happen with this:
-moz-border-top-colors: blue transparent transparent red;
Reporter | ||
Comment 1•17 years ago
|
||
Note this is for both 'background-color' as for 'background-image'.
The first is simple to fix (I have a patch),
but the second requires more thinking,
as what needs to happen with the Anchorpoint when we shrink the background area?
Comment 2•17 years ago
|
||
Mozilla/5.0 (Windows; U; Windows NT 5.0; rv:1.9b4pre) Gecko/2008020702 SeaMonkey/2.0a1pre
SeaMonkey trunk
maybe regression from Bug 359568
Reporter | ||
Comment 3•17 years ago
|
||
This is not an 'regression'. See bug 374156. According to w3c specifications
the background image and color need to also be drawn in the area covered by the
border, even if the border is 'transparent'.
What happens in this 'seamonkey' theme is that the outer two lines of the
border are made transparent. A better solution is to increase the margin and
decrease the border width to achieve the same effect. This is what I have done
in my themes. Or to use 'outline' for that 'hover' (or 'focus') effect.
So, the fix needs to be in the theme code to correctly use border-width, margins and outline.
Two options here:
* DUP this bug to bug 374156 (about the 'transparant' effect of borders)
* rename this bug to address the hover/focus of these buttons themselves.
Comment 4•17 years ago
|
||
Background paint leaks when border used radius.
Comment 5•17 years ago
|
||
Reporter | ||
Comment 6•17 years ago
|
||
This is a slightly different issue:
The 'anti-aliasing' of the background drawing and then the border drawing causes to 'leak' some of the anti-aliasing of the background outside the border.
Comment 7•17 years ago
|
||
Bug 374156 explicitly says that it's _not_ completely clear from the W3C specs what a "transparent" border means.
In any case, we redefine the meaning and functionality of -moz-border-*-colors, which is no W3C property and which is heavily used by themers - this is no good idea.
Reporter | ||
Comment 8•17 years ago
|
||
The problem is that for background-image the whole border area, also for -moz-border-*-colors is filled, but for background-color is used to shrink the bgClipArea to allow the moz-border-*-colors to be "transparent".
The patch
I can prepare a patch to make moz-border-*-color support this kind of "transparency" again, but I think if we do this, this should also be done for background-image.
And what if not the outer lines of the border are transparent, but only the inner lines? These things make all this very complex, and the simplest and best thing to do is to keep the -moz-border-*-colors in line with w3c, even if -colors is not in w3c (yet).
There are other ways to get the outer lines of the border transparent: just use margin instead of overlarge borders (and then making them transparant).
Updated•17 years ago
|
Attachment #301895 -
Attachment mime type: text/plain → text/html
Reporter | ||
Comment 9•12 years ago
|
||
Firefox 4.0 and later has the solution:
background-clip:padding-box;
Status: NEW → RESOLVED
Closed: 12 years ago
Resolution: --- → FIXED
You need to log in
before you can comment on or make changes to this bug.
Description
•