All Questions
Tagged with clip-path google-chrome
22
questions
12
votes
3
answers
5k
views
Clip-path on Chrome leaves a strange line on the edge
I use clip-path to create the particular shape of the blue search button.
From Chrome you see a strange line at the cutout edge, while from Firefox everything is OK.
I am not the first to point this ...
- 558
4
votes
1
answer
688
views
SVG Mask is "bleeding" on canvas edges
I have an animated svg that animates a "gleam/shear" effect. The mask however is not working on the edges of the svg box. I cant seem to figure out why its showing on the edges.
edit - It ...
- 77
3
votes
2
answers
5k
views
How to make SVG clip-path work correctly in Google Chrome?
I'm using an inline SVG together with CSS clip-path property to create a beveled corner on a div element.
On Firefox, the size of the beveled corner is correct. However, on Google Chrome, not only ...
- 2,377
3
votes
2
answers
3k
views
clip-path horizontal white line in Chrome
Got clip-path set on div with background image. When in Chrome horizontal white lines appear through the div / background image. Anyone know how to remove this?
See screenshot:
Screenshot with ...
2
votes
1
answer
3k
views
Problem with CSS SVG Clip path - not working
I have a problem with a clip path css. When I put clip path on my css fill, image wont show... I m on chrome. So you have any idea ?
I use this generator https://10015.io/tools/svg-blob-generator
....
- 337
2
votes
1
answer
1k
views
Inline css clip-path not respected on Chrome
I am making some animation and graphics libraries to work with html. For some things clipping is needed and since the elements are generated dynamically, clip-path (mostly polygon) is added dynamicaly ...
- 8,268
2
votes
1
answer
481
views
Why do clip-path ellipsis have blurred edges in Chrome?
Try the following in Firefox and then try it in Chrome - notice the edge of the ellipse (the green section) has a soft edge in Chrome and hard edge in Firefox
Example: https://getbase.com/products/...
- 429
1
vote
3
answers
3k
views
Problems with CSS clip-path in Google Chrome
The following Website project using the CSS clip-path property works fine in Safari but breaks in Google Chrome (it also works fine in Google Chrome until a few weeks). Is this a bug in Google Chrome ...
- 63
1
vote
1
answer
1k
views
SVG clippath not working with foreignObject in Chrome
I'm trying to get a video mask of some text, overlayed on top of another instance of video. I've achieved the desired effect in FF:
The Text overlay masking the an instance of the same video it is ...
- 163
1
vote
2
answers
2k
views
CSS clip/clip-path on fixed navigation not cooperating in Chrome and IE
I'm attempting to use the CSS clip and clip-path properties to display a floating pager nav for a single-page website layout. I'm trying to get the nav to change colors based on whether it's on a dark ...
- 641
1
vote
1
answer
543
views
clip-path leaves straight lines around my circle
I used clip-path to create a circle in which my image can zoom out and a filter gets applied to it.
But for some reason straight lines are visible during the hover transition.
Wierd lines around image
...
- 13
1
vote
0
answers
616
views
Chrome not rendering specific font-size for SVG text element inside clipPath set as objectBoundingBox
I just discovered clipPathUnits="objectBoundingBox" and it is working out as expected for the most part.
However, Chrome is not behaving when a text element is included as part of the clipping mask ...
- 105
1
vote
0
answers
235
views
Animating an SVG clip-path is not working correctly in Chrome
I am using an SVG clipPath to clip an image. (JSFiddle)
In Chrome, the animation is broken. The clipped image is only re-rendered when something else changes (for example when dragging the divider ...
- 3,507
0
votes
1
answer
2k
views
css clip-path with svg not working in Chrome
I've created an svg for use as a clip-path on an image, and it appears perfect in Firefox, however it doesn't work in Chrome, and I'm wondering what the problem is.
Chrome should support an inline ...
- 4,837
0
votes
1
answer
55
views
Chrome SVG clip-path behave incosistent across monitors
So I have a small HTML snippet below,
<p style="clip-path: polygon(0 0, 100px 0, 100px 10px, 0 10px)">Lorem ipsum dolor sit amet</p>
<svg xmlns="http://www.w3.org/2000/svg" width="...
- 387