<html>
<head>
<base href="https://bugs.webkit.org/" />
</head>
<body><table border="1" cellspacing="0" cellpadding="8">
<tr>
<th>Bug ID</th>
<td><a class="bz_bug_link
bz_status_NEW "
title="NEW - CSS filter:brightness on :active or :hover on static div does not affect absolute elements that overflow its bounds"
href="https://bugs.webkit.org/show_bug.cgi?id=159092">159092</a>
</td>
</tr>
<tr>
<th>Summary</th>
<td>CSS filter:brightness on :active or :hover on static div does not affect absolute elements that overflow its bounds
</td>
</tr>
<tr>
<th>Classification</th>
<td>Unclassified
</td>
</tr>
<tr>
<th>Product</th>
<td>WebKit
</td>
</tr>
<tr>
<th>Version</th>
<td>WebKit Nightly Build
</td>
</tr>
<tr>
<th>Hardware</th>
<td>Macintosh
</td>
</tr>
<tr>
<th>OS</th>
<td>OS X 10.11
</td>
</tr>
<tr>
<th>Status</th>
<td>NEW
</td>
</tr>
<tr>
<th>Severity</th>
<td>Trivial
</td>
</tr>
<tr>
<th>Priority</th>
<td>P2
</td>
</tr>
<tr>
<th>Component</th>
<td>CSS
</td>
</tr>
<tr>
<th>Assignee</th>
<td>webkit-unassigned@lists.webkit.org
</td>
</tr>
<tr>
<th>Reporter</th>
<td>saetia@gmail.com
</td>
</tr></table>
<p>
<div>
<pre>Created <span class=""><a href="attachment.cgi?id=281980" name="attach_281980" title="simple example showing the behavior">attachment 281980</a> <a href="attachment.cgi?id=281980&action=edit" title="simple example showing the behavior">[details]</a></span>
simple example showing the behavior
When a container element with the default static positioning contains an absolutely positioned element that overflows the static container's boundaries will not change in appearance when clicked or hovered on. only the part of the absolute element that overlaps the static element will darken.
clicking on the absolute element will still trigger the brightness effect on the parent element.
if you apply brightness on both :hover and :active, it will work properly.
when viewing the attachment, take a look at the absolute circles. the left side (static) should behave like the right side (relative).
this works as expected in chrome and firefox.</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>