My CSS rules keep disappearing

65 views
Skip to first unread message

Alex Stine

unread,
Jan 16, 2016, 5:11:52 PM1/16/16
to Firebug
Hello,
Sorry if this is not in the right place, it is my first time.
I am having a problem. When editing CSS in Firebug, it changes the div or class I target, but then after i Minimize or switch tabs in Firefox, the custom CSS goes away but the changes still remain on the page.

I have included an example video.
Thanks for your help.

160116-150253.wmv

Alex Stine

unread,
Jan 16, 2016, 6:33:40 PM1/16/16
to Firebug
Here is another video. This one shows me trying to add a custom piece of CSS that is not there, AKA Add new rule.
160116-175021.wmv

alfonsoml

unread,
Jan 16, 2016, 6:39:40 PM1/16/16
to Firebug
To view the rule, you must select one element that it applies to.
When you are creating it you can do whatever you want, but upon "focus", Firebug will show only the rules matching the current element.

Alex Stine

unread,
Jan 16, 2016, 6:42:50 PM1/16/16
to Firebug
Yes, I now understand, but creating a rule, it showed in the second video that it just seemed to disappear. Do you know what happened there?


On Saturday, January 16, 2016 at 5:11:52 PM UTC-5, Alex Stine wrote:

Alex Stine

unread,
Jan 16, 2016, 7:10:47 PM1/16/16
to Firebug
Alright, let me try to explain in a different way.

1. I right click in Firebug and click Add rule.
2. I type in selector.
3. I type in a property for that rule.
4. I minizmize the browser window to Microsoft Word, then come back.
5. The CSS rule and property has disappeared but changes are still there.

Does anyone know what is going on?

On Saturday, January 16, 2016 at 5:11:52 PM UTC-5, Alex Stine wrote:

JP Charrier

unread,
Jan 16, 2016, 9:53:50 PM1/16/16
to fir...@googlegroups.com
Yes... When you do not have the selector highlighted (even for a new rule) it will not show. 

Once you bring the window back, highlight the element you made the new rule for, and it will show. 

Try that and report back :)


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 https://groups.google.com/group/firebug.
To view this discussion on the web visit https://groups.google.com/d/msgid/firebug/34832a6b-f885-4882-8c18-8d8145c9bf9e%40googlegroups.com.
For more options, visit https://groups.google.com/d/optout.

Alex Stine

unread,
Jan 16, 2016, 10:01:44 PM1/16/16
to Firebug
OK, I get it now. That is really confusing. Wouldn't it make more since to have a filter that you could filter between CSS that is there, and custom CSS that you typed in to Firebug? That would make more since to me.


On Saturday, January 16, 2016 at 5:11:52 PM UTC-5, Alex Stine wrote:

JP Charrier

unread,
Jan 16, 2016, 10:11:09 PM1/16/16
to fir...@googlegroups.com
Perhaps... I find it easier to be in context to what is highlighted in the HTML pane. But unfortunately I'm not part of the FB team can only help you understand the way it works now.

Hope that clarifies things for you!

Regards,
JP Charrier
--
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 https://groups.google.com/group/firebug.

tech55541

unread,
Jan 16, 2016, 10:15:46 PM1/16/16
to Firebug
Does the Firebug team pay attention to this group any? Should I start a new post for this feature?

Sebastian Zartner

unread,
Jan 17, 2016, 5:47:14 AM1/17/16
to Firebug
Here is some more detailed explaination for what you see in the two videos:

In the first video you add color: #33891b; as value for the color property, which is wrong. Firebug does not allow you to add complete CSS properties or or even complete CSS rules within the Style side panel. To do that you need to switch to the Edit Mode of the CSS panel.
Note that the Rules view of the built-in Firefox DevTools does allow you to add complete CSS properties (and even multiple CSS properties). And the upcoming version Firebug 3 will fully integrate into the DevTools, therefore it will inherit this feature.

In the second video you add a CSS rule with the selector #footer a in the Style side panel that doesn't match the <body> element. The purpose of the Style side panel is it, though, to show only the CSS rules applying to the element currently selected within the HTML panel.
To edit the CSS style sheet with all its rules, you need to switch to the CSS panel.

There are already issue 5489 and 6902 filed to improve Firebug. And as Firebug 3 is a complete recreation of the extension on top of the DevTools, it will also have those features integrated (to some extend, as the DevTools also don't allow you to paste complete CSS rules including their Rules view yet. Therefore I have created bug 1224534 two months ago).

Best regards,

Sebastian
Reply all
Reply to author
Forward
0 new messages