Neopolitan Nesting

Nesting directly without having to make custom components is another fundamental feature of the format. It's done with a collection of `-- start...`` and `-- end...`` tags

Here's a div that wraps a paragraph section

Source

Code

-- div/
-- class: neoexample

Slide the catch back and open the desk. Slide
the tray across the glass top.

Split the log with a quick, sharp blow. Tack the
strip of carpet to the worn floor.

-- /div

HTML

Here's the output:

Code

<div class="neoexample">
  <p>
    Slide the catch back and open the
    desk. Slide the tray across the
    glass top.
  </p>
  <p>
    Split the log with a quick, sharp
    blow. Tack the strip of carpet to
    the worn floor.
  </p>
</div>

Deep Nesting

Nesting sections can be put inside of other nesting sections the same way _div__ elements can be put inside other divs. (It's a little hard to look at without syntax highlighting. I'm working on that.)

Code

-- div/
-- class: neoexample

-- div/
-- class: alfa

Tend the sheep while the dog wanders

-- /div

-- div/
-- class: bravo

Throw out the used paper cup and plate

-- /div

-- div/
-- class: charlie

Tuck the sheet under the edge of the mat

-- /div

-- /div

Apply some CSS to that and you get this

Tend the sheep while the dog wanders

Throw out the used paper cup and plate

Tuck the sheet under the edge of the mat

Previously: Neopolitan Home Page ~ Next Up: Inline CSS