6
1
One of things I love of modern browsers is how you can edit the css and get to see the results in real time. Often when designing frontend elements, I find myself adjusting many css properties directly in chrome, and only when I'm happy with the result I copy back all the changes to my original css files. I'm not sure how common this practice is, but it works for me.
The question: Is there any way, perhaps an extension, that can compare the original page css in google chrome to the edited one and output all the changes? This may sound lazy, but it can make sense: if you've been editing CSS for about an hour on chrome, tracking back all the changes accross all divs and classes can be time consuming, and that's where a tool to output the changes immediately would save a lot of time.
Edit: Or perhaps this can be done with some javascript wizardry in the console?
Mahn
Posted 2012-07-10T16:47:35.083
Reputation: 742
3
Whilst this may theoretically answer the question, it would be preferable to include the essential parts of the answer here, and provide the link for reference. Thanks
– Der Hochstapler – 2012-07-21T16:29:25.897@OliverSalzburg I think there's no need here... If I'd include the essential parts I'd copy the post. The post is full of pictures that highlight the entire process. – Leniel Maccaferri – 2012-07-21T16:33:51.620
1You don't need to copy everything over. Just summarize the concept so that your answer can stand without having to follow the link. – Der Hochstapler – 2012-07-21T16:42:45.927
1Terrific, it must have been a newly added feature to chrome because I didn't notice the changes being highlighted in the resources page of chrome before but they indeed show up now! Thank a lot! – Mahn – 2012-07-21T16:56:30.857
As a side note I find it funny how the day I posted this question is the exact same day that blog post was created; had I searched a few hours later perhaps I would have found it... anyway Google Chrome rocks. – Mahn – 2012-07-21T21:16:08.710
(Also, @OliverSalzburg is probably right in that if you are linking to content outside you would normally write a short summary first — not an issue for me since I got my question answered but I can understand why would he say that) – Mahn – 2012-07-21T21:20:40.563
Hadn't noted that! Really interesting... I got to your question while looking for this very question but for Firefox + Firebug. I was tired of searching and then decided to look for Chrome and found the link. I see no problem following a link if it answers the question! Links are for that. Why would I rewrite/summarize (why not say repeat) the the steps if they are really well described in the linked post? :) – Leniel Maccaferri – 2012-07-21T21:24:19.980
3
Hello, I'm the author of the blog article. I've discovered the "save as" option watching a Google IO 2011 presentation, here is the link:
http://www.youtube.com/watch?v=N8SS-rUEZPg&feature=player_detailpage#t=515s
this is really interesting, there are also other new features like CSS autocomplete and CSS revision.
@contam: great great finding... and thanks again for sharing. – Leniel Maccaferri – 2012-07-23T14:42:33.217
@contam this is great, thanks a lot, I guess we should keep up with Google IO chrome related stuff! – Mahn – 2012-07-27T21:23:36.350