Box-shadow should perfect

Not reproducible Issue #12104253

Details

Author
John J.
Created
May 23, 2017
Privacy
This issue is public.
Found in
  • Microsoft Edge
  • Internet Explorer
Reports
Reported by 2 people

Sign in to watch or report this issue.

Steps to reproduce

Demo: https://todc.github.io/todc-bootstrap/css/#buttons-options

Too ugly.
You should use soft shadow, not hard & snap-to-pixel.

Attachments

2 attachments

Comments and activity

  • Microsoft Edge Team

    Changed Assigned To to “James M.”

  • Hello,

    Thank you for providing this information about the issue. We are best suited to test and correct broken features for future releases of MS Edge. Please always feel welcome to submit your feature request at http://uservoice.microsoftedge.com where other developers can up-vote your suggestion.

    Best Wishes,
    The MS Edge Team

  • No, this is not a feature request.
    This is a problem.

    Another example: https://jsfiddle.net/cv3u3jfs/1
    Try different zoom rate.


    Edge:

    Chrome:


    Image zoomed for readability

    Edge:

    Chrome:

  • My English is bad, please think a better title, thanks.

  • Hello,

    Thank you for providing more information about the issue. We can see the difference in the screenshots, but after following the steps, we are still unable to repro the problem. Please update this case when you can run dxdiag (Windows key + r and type dxdiag, enter, then click Save all Information) and attach the txt file.

    Best Wishes,
    The MS Edge Team

  • Changed Title from “Box-shadow should not snap to pixel” to “Box-shadow should perfect”

  • Microsoft Edge Team

    Changed Status to “Not reproducible”

  • Hey John,

    I am unsure if this Edge issue is still reoccurring(yet to be solved) for you… However, I have a temporary fix you can use until Microsoft Edge team has an official fix:

    Here’s how:

    Use the filter property (with space between one drop-shadow to another)

    filter: drop-shadow(0 3px 0 #99ECFF) drop-shadow(3px 0 0 #99ECFF) drop-shadow(0 -3px 0 #99ECFF) drop-shadow(-3px 0 0 #99ECFF);
    

    This applies shadow to all four sides of a box.

    Note: box-shadow itself is flawed in Edge, so doesn’t work if we replace filter with box-shadow property in the above method.

    Hope this helps.

    – Pavan.

You need to sign in to your Microsoft account to add a comment.

Sign in