Closed
Bug 1042523
Opened 10 years ago
Closed 9 years ago
[markup-view] displays :hover state on each element on breadcrump
Categories
(DevTools :: Inspector, defect)
Tracking
(Not tracked)
RESOLVED
WORKSFORME
People
(Reporter: friedrich, Unassigned)
Details
User Agent: Mozilla/5.0 (X11; Ubuntu; Linux x86_64; rv:30.0) Gecko/20100101 Firefox/30.0 (Beta/Release) Build ID: 20140608211828 Steps to reproduce: I visit https://addons.mozilla.org/de/firefox/ and start Firefox SiteInspector to look at the Element "#site-nav". Now with Firefox Inspector, I activate the :hover state of "#site-nav > li". Actual results: it displays the hover state on each element in the breadcrumb navigation. Expected results: i think only the seleccted element should get the hover state.
Comment 1•9 years ago
|
||
That's correct behavior. The ancestors of a hovered element also get :hover applied. To quote the Selectors spec[1]: > The parent of an element that matches :hover also matches :hover. Hover the 'child' <div> in this example for an illustration data:text/html,<!DOCTYPE html><style type="text/css">%23parent, %23child {width:100px;height:100px;text-align:center} %23parent {background-color:%236464ff;} %23child {position:absolute;top:50px;left:150px;background-color:%23c8c8ff;} %23parent:hover {background-color:yellow;} %23child:hover{background-color:yellow;}</style><div id="parent">parent<div id="child">child</div></div> and you'll see that both, the child and the parent, become yellow. Sebastian [1] http://dev.w3.org/csswg/selectors-4/#the-hover-pseudo
Status: UNCONFIRMED → RESOLVED
Closed: 9 years ago
Resolution: --- → WORKSFORME
Updated•6 years ago
|
Product: Firefox → DevTools
You need to log in
before you can comment on or make changes to this bug.
Description
•