Firebug CSS Panel Misses Specificity Overwrite Strike Out for any elements with :before

53 views
Skip to first unread message

Zipzit

unread,
Jun 29, 2014, 6:30:50 PM6/29/14
to fir...@googlegroups.com

I'm working on a site with lots of Cascading Style Sheet (CSS) overwrites.    Normally when a CSS rule is superseded based on Specificity rankings the Firebug Style tool shows the old CSS line in font strikeout mode.  This indicates you should look elsewhere for the actual CSS rule in place.  Unfortunately this tool doesn't work correctly for any element with pseudo elements of the form '.mobile_menu_bar:before'    The firefox browser functions correctly but you really can't tell from firebug which rule is in effect.  This strikeout display function works fine in Chrome Developer Tools.  Is this a bug or intended function?  If intended, why is firebug designed this way?  

See attached image an example with the stacked sandwich icon for my mobile display navigation:  Chrome Dev Tools on the left (with strikeouts on numerous elements) Firebug on the Right with none.  Without those strikeout lines its sort of difficult to determine which element is controlling the display.  


And I'm sure someone is going to ask, why do overwrites on CSS in the first place? Glad you asked.  When working on a heavy content purchased theme in Wordpress, any customization should be done on a child theme.  That way upgrades to the themes become simple plug ins.  Additionally it makes it much easier to troubleshoot problems.. did the issue come from the theme or did it come from theme customization?  The other place you will see lots of CSS overwrites is when using @media...

thanks,
Zip.

Jon-Pierre Charrier

unread,
Jun 30, 2014, 3:19:47 AM6/30/14
to <firebug@googlegroups.com>
Can I add to this in these cases you often compile from multiple style sheets (especially when using LESS or SASS). Chrome Dev Tools can read css source maps however firebug can not... Can someone please add some development time to this issue as it's causing a lot of us to be forced to use other tools (not happy). 

There is already an issue open for this however no one seems to making any headway...

Thoughts?

Regards,
JP Charrier

Sent from my iPhone
--
You received this message because you are subscribed to the Google Groups "Firebug" group.
To unsubscribe from this group and stop receiving emails from it, send an email to firebug+u...@googlegroups.com.
To post to this group, send email to fir...@googlegroups.com.
Visit this group at http://groups.google.com/group/firebug.
To view this discussion on the web visit https://groups.google.com/d/msgid/firebug/2f9a76a7-bbeb-4b2e-abc0-3d3e8df98f62%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Sebastian Zartner

unread,
Jun 12, 2015, 9:39:21 AM6/12/15
to fir...@googlegroups.com
It looks like this problem got missed so far. Note that Firebug 3 will integrate into the Firefox DevTools. So if it's working there, it will also work in Firebug 3. If it's also not working within the Firefox DevTools, please file an issue against them.

Sebastian
Reply all
Reply to author
Forward
0 new messages