<html>
<head>
<base href="https://bugs.webkit.org/" />
</head>
<body>
<p>
<div>
<b><a class="bz_bug_link
bz_status_NEW "
title="NEW - Reflow on hover: http://jsbin.com/dogoveziji/edit?html,css,output"
href="https://bugs.webkit.org/show_bug.cgi?id=166618#c4">Comment # 4</a>
on <a class="bz_bug_link
bz_status_NEW "
title="NEW - Reflow on hover: http://jsbin.com/dogoveziji/edit?html,css,output"
href="https://bugs.webkit.org/show_bug.cgi?id=166618">bug 166618</a>
from <span class="vcard"><a class="email" href="mailto:039706@gmail.com" title="039706@gmail.com">039706@gmail.com</a>
</span></b>
<pre>Above I have attached 2 files to demonstrate the problem I am encountering.
The situation is the following:
1) instead of using <table> tag to display the tabular data, we are using divs with display properties of "table" and "table-row" , "table-cell" accordingly. (this is done in order to achieve the fixed header effect)
2) it is needed that border-bottom change color when the user hovers over the row (that's where the issue in Chrome appears, as when moving the mouse from top to bottom the border-bottom color does not change, and when going from bottom up - it starts acting weird)
3) In order to make border change color on hover state, I use the following CSS rule (*ISSUE)
el:hover{
border-bottom-color: blue;
}
4)This is how I currently avoid that problem (*WORKAROUND)
el:hover{
border: 1px solid blue;
border-left:none;
border-right:none;
}
The problem appears in Chrome/55.0.2883.87. I would be glad to test it in Chrome 55.0.2883.95 (but as far as I could understand that version of Chrome is the current stable for MacOS, and I am using Windows)
Should I rather report the issue to the Chrome browser developers?
(The reason I reported it here was that the reflow problem occurred not only in Chrome but also in Opera )</pre>
</div>
</p>
<hr>
<span>You are receiving this mail because:</span>
<ul>
<li>You are the assignee for the bug.</li>
</ul>
</body>
</html>