Pen Settings



CSS Base

Vendor Prefixing

Add External Stylesheets/Pens

Any URL's added here will be added as <link>s in order, and before the CSS in the editor. If you link to another Pen, it will include the CSS from that Pen. If the preprocessor matches, it will attempt to combine them before processing.

+ add another resource


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


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.


Save Automatically?

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.


  body {margin-top: 40 px;
  margin-right: 20 px;
  Margin-bottom: 40 px;
  margin-left: 20 px;
  P {font-family:"Book Antiqua", Palatino, 'Palatino Linotype', 'Palatino LT STD', Georgia, serif;
  p {margin: 15px 30px 15px 30px;
  .word-text {font-family:"Book Antiqua", Palatino, 'Palatino Linotype', 'Palatino LT STD', Georgia, serif;
  .smaller-image {
    width: 400px;
  .center-block {
    display: block;
    margin-left: auto;
    margin-right: auto;

<h1 class= "text-center word-text" >Karl Blossfeldt</h1>
<h2 class= "text-center word-text">Plant photographer</h2>
<div class="row">
  <img class= "smaller-image center-block row col-med-4" src= "">
<img class="smaller-image center-block row col-med-4" src= "">

<img class="smaller-image center-block row col-med-4" src= ""></div>
<h3 class= "word-text">Background</h3>

<p>Blossfeldt, born in 1865 in Germany's Harz Mountains, was the son of a beadle and famrer. His first apprenticeship was at a foundry of the nearby Madesprung ironworks which produced, among other things, grilles and gates decorated with plant ornaments. </P>
<P>Blossfeldt received a grant to study at the Pedgogic Institute of the Berlin Museum of Arts and Crafts where he studied under crafts teacher Mortiz Meurer. Meurer was charged wtih bringing German design to the level of international compitions: he saw the basis of art in naturalism flowing from the observation of nature. Commissioned by the Prussian Board of Trade to launch this artistic initiative, Meuer had six assistants produce models and drawings for him, one of whom was Blossfeldt.  </P>
<p>Under Meuer's guidance, they cataloged hundreds of plants. Of his works, dates 1896, includes Blossfeldt's first published photos. 
  <h4 class= "word-text">Coming Into His Own</h4>
<p>Blossfeldt, who had no interest from publishers, became a lecturer in 1898  in Berlin's Charlottenburg School of Arts and Crafts. The following year he began the subject of "modelling from living plants", a field  that addressed all of his interests. He was appointed as Professor in 1921. He published his first book in 1928.</p>
<h4 class= "word-text">Critical Acclaim</h4>
<p>Bauhaus teacher Laszlo Moholy-Nagy showed Blossfeldt's photographs at a ground-breaking Stuttgart exhbit "Film and Foto" in 1929. with its mathametical beauty and scientifc presentation, his work was perceived as transcending the antagonism between traditionalism and the advent garde.</P>
<ul class= "word-text">For more information on Blossfeldt:
  <li>Here's a <a href ''>link</a> to his Wiki page</li>
  <li>The Complete Portfolio of <a href ''>Urformen der Kunst</a></li>
  <li> An <a href ''>essay</a> by Hanako Murata</li>


                <h1 class= "text-primary"></h1>



                document.getElementsByTagName("h1")[0].style.fontSize = "80px";