Babel includes JSX processing.
Any URL's added here will be added as
If active, Pens will autosave every 30 seconds after being saved once.
If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.
If enabled, your code will be formatted when you actively save your Pen. Note: your code becomes un-folded during formatting.
Visit your global Editor Settings.
h1 Single-Image Retina Solution p Double dimensions, crank the compression, scale to 50% in browser. div img(src="https://dbox.us/_img/mbpro1x.jpg") h4 Original Non-Retina - 600 x 400 ul li Jpeg compressed at 80% li b 37,418 bytes div.retina img(src="https://dbox.us/_img/mbpro%402x.jpg") h4 Retina - 1200 x 800 ul li Jpeg compressed at 30% li Looks great on retina because tiny pixels don't pick up on extra compression li Looks great on standard because resampling hides compression li Actually smaller filesize! li b.awesome 36,825 bytes
div max-width: 600px width: 48% float: left margin-right: 1px img width: 100% height: auto .awesome color: green
Also see: Tab Triggers