Bert Coules Posted November 24, 2014 Share Posted November 24, 2014 (edited) Is it possible to insert an extra space between two particular paragraphs equivalent to one and a half line heights? Like this (though this isn't to scale): Paragraph one (1 blank line) Paragraph two (1.5 blank lines) Paragraph three (1 blank line) Paragraph four I know about setting the paragraph spacing globally, but I need it to happen just once. I tried setting an increased height for a single paragraph, but that affects the spacing both before and after it. Edited to add: Someone elsewhere kindly advised me to apply a style to paragraph three: <p style="margin-top: 1.5em;"> Which works a treat. It does feel slightly odd to be putting a formatting command in a php file rather the stylesheet, but I suppose for a single instance it really is far more sensible. Edited November 24, 2014 by Bert Coules Link to comment Share on other sites More sharing options...
niche Posted November 24, 2014 Share Posted November 24, 2014 (edited) line-height http://www.webmasterworld.com/forum83/100.htm Edited November 24, 2014 by niche Link to comment Share on other sites More sharing options...
Ingolme Posted November 24, 2014 Share Posted November 24, 2014 Margin is the best way to put space between paragraphs. If you don't want to use a style attribute you can give a class name to it instead and put a class in your stylesheet with the margin on it. Link to comment Share on other sites More sharing options...
tejasamrute Posted November 24, 2014 Share Posted November 24, 2014 Pure HTML <p style="margin-bottom:1em">Paragraph 1</p> <p style="margin-bottom:1.5em">Paragraph 2</p> <p style="margin-bottom:2em">Paragraph 3</p> OR HTML with CSS .paramargin1 { margin-bottom:1em; } .paramargin2 { margin-bottom:1.5em; } <p class="paramargin1">Paragraph 1</p> <p class="paramargin2>Paragraph 2</p> <p class="paramargin1">Paragraph 3</p> Link to comment Share on other sites More sharing options...
Bert Coules Posted November 24, 2014 Author Share Posted November 24, 2014 Thanks for the replies. If I needed to apply that formatting in more than one instance I'd put it into the stylesheet, but for a one-off it seems more sensible to put it in the php file. Link to comment Share on other sites More sharing options...
tejasamrute Posted November 24, 2014 Share Posted November 24, 2014 You can also use p { margin-bottom:1em; } p:nth-child(2) { margin-bottom:1.5em; } <p>Paragraph 1</p> <p>Paragraph 2</p> <p>Paragraph 3</p> PS - Check :nth-child browser compatibility Link to comment Share on other sites More sharing options...
Bert Coules Posted November 24, 2014 Author Share Posted November 24, 2014 Tezzo thanks, it's useful to have another alternative method. Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now