Crazy safari web inspector question

HTML & CSS
1

I didn’t know where to ask this question. I can’t seem to find the answer on the web. I’ve posted on stack overflow and apple and haven’t received any response on either forum. I was hoping the sitepoint experts might know? Here goes:

Is there a way to copy CSS rules in OSXs Safari web Inspector like you can in Firebug on Firefox? In Firebug, you can right click and copy the newly created CSS selector and declaration block that you create for testing. I can’t find an easy way to do this in web Inspector.

2

If you inspect an element, you’ll see the CSS for that element in the right-hand panel. Each declaration has a link to the stylesheet on which it appears. If you click that link, you can edit the style sheet directly. You can write any styles you like, and then just highlight and copy them.

3

About 7 min into this video by Paul Irish you get a nice guide how to do this and copy the css with the rules you added.

4

Thanks, ralph. What if I add a new style and want to copy the block? In Firefox, I can right click on the style and “copy rule declaration”. In Safari Mavericks, I can’t find a way to do it, unfortunately. I may be stuck with using firebug in Firefox - which isn’t a bad thing by any means. Thank you for your help.

Paul: thanks for your video tip but unfortunately it is for Chrome, not Safari. I seem to be amongst the dwindling numbers who think firebug in Firefox is still the best in-browser web dev tool out there.I thought Safari won me over till I couldn’t find a way to copy CSS styles I created in web inspector. Thanks for your help.

5

That’s what I was talking about above. Anyhow, try Chrome, I used to be a Firebug devotee, but the Chrome dev tools won me over.