Border appears on hover, possible background leak from surrounding element

Issue #11935188 • Assigned to Christian F.

Details

Author
Reece M.
Created
May 8, 2017
Privacy
This issue is public.
Found in
  • Microsoft Edge
Reports
Reported by 1 person

Sign in to watch or report this issue.

Steps to reproduce

When hovering over rows that contain multiple links alongside one another there appears to be a rendering error where a 1px border is created at the bottom of the links (in the upper row). There is no border style declaration present to justify this (the opposite in fact since there is a CSS wildcard reset to remove borders from all elements) so has no reason to be there.

Furthermore, the newly introduced border remains once the cursor has been completely moved off of it.

Steps to reproduce

  1. Hover over the top row (dark blue background colour) in the “Issue as is” column.
  2. See the presence of a 1px border at the bottom that only appears on hover

Note - Included alongside the “Issue as is” column is "Modified (fixed)" alternative that acts as an example to remove the issue. The ‘fixed’ column is identical in markup and CSS declarations as the ‘Issue as is’ column but includes a wrapping element with the following declarations attached via class attribute "position:relative; top:1px; left:0;".

What is the expected behaviour

For the rendering issue that appears as a border to links to simply not occur and for the border to not remain present once the cursor has been moved off the link.

Area

Navigation links

Attachments

Comments and activity

  • Microsoft Edge Team

    Changed Assigned To to “James M.”

  • Hello,

    Thank you for providing this information about the issue. Unfortunately, we are unable to reproduce this problem in Edge with the information at hand. Specifically, it appears you have attached a sample for a different repro. Please update this case with a sample for this repro.

    Best Wishes,
    The MS Edge Team

  • Hi,

    To clarify the repro area titled “Issue as is” highlights the error and the "Modified (fixed)" area is a fix I have introduced, however in the product/application that I intend to use these markup and styles the ‘fix’ is not suitable since there are many other page items, surrounding elements and visual dependencies so please use this area purely as a reference of the repros intended behaviour.

    I will attach an image to this issue where I have clearly highlighted the issue I am seeing to make it apparent what should be addressed.

    After extensive checking I can confirm that the issue does not appear in any other widely used browsers including; Chrome, Safari, Firefox, even Internet Explorer so this is specifically an Edge browser issue.

  • Hello,

    Thank you for providing this information about the issue. After thorough testing, we are unable to reproduce this problem in Edge. Please test this behavior in our latest creator’s update 15063 or the insider build 16188.

    Best Wishes,
    The MS Edge Team

  • Hi,

    Can is it possible to discuss this issue directly with you, either using a support tool of over a phone call? It would be much easier to explain and highlight the defect directly to you

    Regards, Reece

  • Hello,

    I do not have any other channels of communication for reporting bugs in Edge. If you found a problem, please provide us with a reduced code sample which we can then investigate.

    In this case, we already know exactly what to expect in your repro. So, you should be able to provide us with a webpage which does not have the workaround code, and we will use that to isolate the source of the problem.

    Best Wishes,
    The MS Edge Team

  • Hi

    I have attached a reduced code sample as requested (PageTestMSEdgeBugOnHoverExampleReduced.html). Furthermore I have attached a video that very clearly illustrates both the issue and how simply it is created (MSEdgeBugVideo1080p.mp4).

    Regards, Reece

  • Microsoft Edge Team

    Changed Assigned To to “Rick J.”

    Changed Assigned To from “Rick J.” to “Christian F.”

  • Hi, is it possible to get an update on this issue?

    I have noticed that it has been assigned and reassigned to other Edge team member. Did the video make the issue clear enough? Have you been able to replicate the issue now?

    Regards, Reece

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

Sign in