http://code.activestate.com/recipes/langs/javascript/tags/css/2013-11-20T21:15:22-08:00ActiveState Code Recipes2013-11-20T21:15:22-08:00Magnus Axelssonhttp://code.activestate.com/recipes/users/4188509/http://code.activestate.com/recipes/578769-css-line-with-px-value-adds-a-new-line-with-rem/

<p style="color: grey"> JavaScript recipe 578769 by <a href="/recipes/users/4188509/">Magnus Axelsson</a> (<a href="/recipes/tags/convert/">convert</a>, <a href="/recipes/tags/css/">css</a>, <a href="/recipes/tags/komodo/">komodo</a>, <a href="/recipes/tags/macro/">macro</a>). </p> <p>Put your cursor on a CSS line that ends with a value in px (do not select any text). Run the script and it will insert a new line there the px value is converted to a rem value. </p> <p>You need to edit the code to modify your rem base matching the one you use in your own CSS. The default value is 16.</p> <p>Example: font-size: 12px; (run the script with the cursor in this line) font-size: 0.75rem (new line added by script) </p>

2012-05-25T20:02:50-07:00Keegan Brownhttp://code.activestate.com/recipes/users/4182206/http://code.activestate.com/recipes/578145-komodo-js-macro-add-css3-prefixes/

<p style="color: grey"> JavaScript recipe 578145 by <a href="/recipes/users/4182206/">Keegan Brown</a> (<a href="/recipes/tags/css/">css</a>, <a href="/recipes/tags/macro/">macro</a>). </p> <p>Simple macro to add vendor prefixes to a CSS declaration under the cursor. Isn't smart and doesn't know what needs a prefix and what doesn't, just adds all the prefixes. </p>

2011-11-16T15:23:03-08:00Skye Giordanohttp://code.activestate.com/recipes/users/4179718/http://code.activestate.com/recipes/577948-auto-insert-css-image-widthheight-macro/

<p style="color: grey"> JavaScript recipe 577948 by <a href="/recipes/users/4179718/">Skye Giordano</a> (<a href="/recipes/tags/css/">css</a>, <a href="/recipes/tags/height/">height</a>, <a href="/recipes/tags/image/">image</a>, <a href="/recipes/tags/width/">width</a>). </p> <p>Based on the macro at <a href="http://community.activestate.com/forum/html-editing-img-tag-expansion-etc" rel="nofollow">http://community.activestate.com/forum/html-editing-img-tag-expansion-etc</a> I hacked together this alternate version that will auto insert the width: and height: of an image background in a CSS rule turning this:</p> <p>background: url(http://server.com/myImg.jpg) 0 0 no-repeat;</p> <p>...into this:</p> <p>background: url(http://server.com/myImg.jpg) 0 0 no-repeat; height: 252px; width: 200px;</p>