home ~ projects ~ socials

Neopolitan - Nested Sections

Nested sections are also possible. For example, I use / in my naming convention to denote the starting and ending points. Things like

  • -- div/
  • -- /div

This let's me do things like put things in grides from directly in the content. For example, this:

----------------------------- div/
-- class: make_grid

-- p

Alfa Bravo

-- p

Charlie Delta

----------------------------- /div


----------------------------- css

.make_grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
}

.make_grid p {
  text-align: center;
  margin: 2rem;
  background-color: goldenrod;
}

Produces this:

Alfa Bravo

Charlie Delta

There's no external CSS or JS called. That's all directly from the content snippet.

I'm using the fact that extra dashes can be added to the start of sections to make it a little easier to see the breaks. That's not necessary though. Or, you could flip it and have the div tags only be two dashes with the longer set of dashing added to the p tags

Previous: Preformatted Content Types ~ Next: Implicit Inline Tags

-- end of line --