Scoottavepe
New Member
This is a basic but tricky question about styling header with General Sibling Selector. Many people make a mistake about using it (and write books!). It seems for me useless:\[code\]<h1>Title 1</h1><p>text</p><p>text</p><h2>Title 1.1</h2><p>text</p><p>text</p><h3>Title 1.1.1</h3><p>text</p><p>text</p><h2>Title 1.2</h2><p>text</p><p>text</p><h3>Title 1.2.1</h3><p>text</p><p>text</p>\[/code\]I would like to style all my P with a margin:\[code\]H1 ~ P { margin-left: 1em; }H2 ~ P { margin-left: 2em; }H3 ~ P { margin-left: 3em; }\[/code\]It simply can't work ! Because P of section 1.2 are after a H3 and styled by H3 isntead of H2.
- I can't use H2+P because I can have many P.
- I don't want to use \[code\]<div>\[/code\] around the P it's too cludge.
- if I do not put a wraper on this code all P in the page after this code will be selected !