I'm trying to get a style to indent like the following
H1
Content here
H2
Any content after the H2, paragraphs, images, etc
H3
Any content after the H2, paragraphs, images, etc
H2
content
H1 another top level heading
etc
Sample html:
<h1>heading 1</h1>
<p>content</p>
<h2>heading 2</h2>
<p>content</p>
<p>content</p>
<h3>heading 2</h3>
<p>content</p>
<img src="something.png" />
<p>content</p>
<h1>heading 1</h1>
<p>content</p>
I've tried the following
h2, h2 + * {
margin-left: 30px;
}
h3, h3 + * {
margin-left: 60px;
}
But this only sets a margin on the first element after the heading, I need all subsequent tags, until the next one.
Any questions please ask.
I'd like to point out that I can't rewrite the hml as I'm applying this to a website where many pages have already been created.
Some sample code https://codepen.io/User1972/pen/WZyKNR