Pen Settings

HTML

CSS

CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URLs added here will be added as <link>s in order, and before the CSS in the editor. You can use the CSS from another Pen by using its URL and the proper URL extension.

+ add another resource

JavaScript

Babel includes JSX processing.

Add External Scripts/Pens

Any URL's added here will be added as <script>s in order, and run before the JavaScript in the editor. You can use the URL of any other Pen and it will include the JavaScript from that Pen.

+ add another resource

Packages

Add Packages

Search for and use JavaScript packages from npm here. By selecting a package, an import statement will be added to the top of the JavaScript editor for this package.

Behavior

Auto Save

If active, Pens will autosave every 30 seconds after being saved once.

Auto-Updating Preview

If enabled, the preview panel updates automatically as you code. If disabled, use the "Run" button to update.

Format on Save

If enabled, your code will be formatted when you actively save your Pen. Note: your code becomes un-folded during formatting.

Editor Settings

Code Indentation

Want to change your Syntax Highlighting theme, Fonts and more?

Visit your global Editor Settings.

HTML

              
                    
    <article>
      <header>
        <h1>A secret weapon to fight climate change: dirt</h1>
      </header>
            
<div class="article-body">
  
<div class="publication-details">
  <span class="author">by Debbie Barker and Michael Pollan</span>
  <span class="publication"><cite>The Washington Post</cite></span>
  <time class="pubdate" datetime="2015-12-15T10:00:00-05:00" >December 15, 2015</time>
</div>

<p>When Will Allen is asked to name the most beautiful part of his <a title="cedarcirclefarm.org" href="https://cedarcirclefarm.org/">Vermont farm</a>, he doesn’t talk about the verdant, rolling hills or easy access to the Connecticut River. Though the space is a picturesque postcard of the agrarian idyll, Allen points down, to the dirt. “This precious resource not only grows food,” he says, “but is one of the best methods we have for sequestering carbon.”</p>

<p>We think of climate change as a consequence of burning fossil fuels. But a third of the carbon in the atmosphere today used to be in the soil, and modern farming is largely to blame. Practices such as the overuse of chemicals, excessive tilling and the use of heavy machinery disturb the soil’s organic matter, exposing carbon molecules to the air, where they combine with oxygen to create carbon dioxide. Put another way: Human activity has turned the living and fertile carbon system in our dirt into a toxic atmospheric gas.</p>

<aside class="pullquote">Climate change, quite simply, cannot be halted without fixing agriculture.</aside>

<p>It’s possible to halt and even reverse this process through better agricultural policies and practices. Unfortunately, the world leaders who <a title="www.washingtonpost.com" href="https://www.washingtonpost.com/business/economy/obama-urges-world-action-on-climate-change-hour-is-almost-upon-us/2015/11/30/2765bac4-975c-11e5-8917-653b65c809eb_story.html">gathered in Paris</a> this past week have paid little attention to the critical links between climate change and agriculture. That’s a huge mistake and a missed opportunity. Our unsustainable farming methods are a central contributor to greenhouse gas emissions. Climate change, quite simply, cannot be halted without fixing agriculture.</p>

<p>The industrialization of farming has allowed farmers to grow more crops more quickly. But modern techniques have also wreaked havoc on the earth, water and atmosphere. Intense plowing, for example, has introduced more oxygen into the soil, boosting the microbes that convert organic matter into carbon dioxide. The quest to wring every last dollar out of fields has put pressure on farmers to rely on chemical fertilizers. This often leaves fields more bare between growing seasons, allowing carbon to escape into the air. Scientists estimate that cultivated soil has lost <a title="e360.yale.edu" href="http://e360.yale.edu/feature/soil_as_carbon_storehouse_new_weapon_in_climate_fight/2744/">50 to 70 percent</a> of its carbon, speeding up climate change.</p>

<p>That loss has significantly degraded soil health, reducing our ability to grow food. Median crop yields are likely to decline by about <a title="www.centerforfoodsafety.org" href="http://www.centerforfoodsafety.org/press-releases/4139/un-must-include-soil-health-in-climate-mitigation-strategies">2 percent per decade through 2100</a>, according to the U.N. Intergovernmental Panel on Climate Change. At the same time, the world’s population is projected to jump from 7 billion to 9 billion by 2050.</p>

<p>Water availability is also at risk. Currently, <a title="water.worldbank.org" href="http://water.worldbank.org/topics/water-resources-management/water-and-climate-change">1.6 billion people</a> live in regions facing severe water scarcity; that number is expected to rise to 2.8 billion by 2025. Agriculture accounts for a whopping <a title="www.worldometers.info" href="http://www.worldometers.info/water/">70 percent</a> of all water consumption. That’s in large part because degraded soil doesn’t absorb water efficiently. Instead, water sits on top of the ground and runs off (along with farm chemicals) into nearby waterways, creating toxic nitrogen “dead zones.”</p>

<p>Remarkably, though, restoring carbon to the soil is not nearly as complicated as rethinking our transportation systems or replacing coal with renewable energy. Innovative farmers such as Allen already know the recipe.</p>

<p>He and his team place “cover crops” in their fields, planting things like oats, rye and beans between rows of vegetables. This practice keeps carbon, nitrogen and other organic nutrients in the soil. “Keeping as much ground covered with plants as long as possible allows photosynthesis to draw down atmospheric carbon into soils,” Allen says. A bare field, in contrast, represents a waste of photosynthetic potential. Allen also composts, limits plowing and avoids synthetic chemicals like nitrogen fertilizers. In combination, these efforts have increased soil organic matter by 3 to 4 percent in just three years. Allen also sells some of his cover crops, adding farm income.</p>

<p>Allen’s results are not unusual. <a title="www.esa.org" href="http://www.esa.org/esa/wp-content/uploads/2012/12/carbonsequestrationinsoils.pdf">Studies</a> have <a title="www.moralactiononclimate.org" href="http://www.moralactiononclimate.org/index.php/downloads/biodiversity-for-a-livable-climate/31-climate-restoration-solutions-healthy-soils-fact-sheet-1/file">shown</a> that cover cropping, crop rotation and no-till farming could restore global soil health while significantly decreasing farms’ carbon footprint. Some scientists project that 75 to 100 parts per million of CO2 could be drawn out of the atmosphere over the next century if existing farms, pastures and forestry systems were managed to maximize carbon sequestration. That’s significant when you consider that CO2 levels passed 400 ppm this spring. Scientists agree that the safe level of carbon dioxide in the atmosphere is <a title="400.350.org" href="http://400.350.org/">350 ppm</a>.</p>

<p>Regenerative farming would also increase the fertility of the land, making it more productive and better able to absorb and hold water, a critical function especially in times of climate-related floods and droughts. Carbon-rich fields require less synthetic nitrogen fertilizer and generate more productive crops, cutting farmer expenses…</p>

<footer>Isn't this a cool article? I borrowed the first part of it to make this web page layout example. You should go <a href="http://michaelpollan.com/articles-archive/a-secret-weapon-to-fight-climate-change-dirt/">read the rest on Michael Pollan's website</a>.</footer>

    </div>
    
    </article>

              
            
!

CSS

              
                html {
  font-family: 'AdobeGaramondW01-Regula', georgia, serif;
  font-size: 18px;
}

// Header --------------------------------------------------

header {
  background: #2E1811;
  background-image: url('http://labs.jensimmons.com/2016/examples/images/dirt.jpg');
  background-size: cover;
  padding: 2rem 0;
  color: #fff;
  text-shadow: 0px 1px 6px rgba(0,0,0,0.6);
}
h1 {
  font-family: 'BauerBodoniW01-BoldDisp', georgia, serif;  
  width: 80%;
  margin: 0 auto;
  line-height: 1.1em;
  font-size: 2rem;
  @media (min-width: 500px) {
    font-size: 4rem;
  }
}


// Publication Details -------------------------------------

.publication-details {
  border-top: 1px solid rgba(0,0,0,0.7);
  border-bottom: 1px solid rgba(0,0,0,0.7);
  padding: 0.5em 0 0.3333em;
  margin-bottom: 2em;
  text-align: center;
}
.author,
.publication,
.pubdate {
  padding: 0.1em 0.25em;
  margin: 0.25em 0;
}
.author::after,
.publication::after {
  content: " ⋄ ";
  opacity: 0.7;
  margin-left: 0.5em;
}
cite {
  font-style: italic;
}

// Article body --------------------------------------------

.article-body {
  width: 80%;
  margin: 2rem auto;
  p {
    line-height: 1.6em;
    text-indent: 1em;
  }
  a {
    color: green;
  }
}
.pullquote {
  margin: 1em 0;
  font-family: 'BauerBodoniW01-BoldDisp', georgia, serif; 
  font-size: 2rem;
  @media (min-width: 500px) {
    font-size: 3rem;
  }
}
footer {
  padding: 0.8em 1em;
  background: #e1f3cc;
  font-style: italic;
}

              
            
!

JS

              
                
              
            
!
999px

Console