1

I'm styling a div object so that its content behaves like a normal text.

As first thing I set its line height as the default line-height of a line in a paragraph.

I got this by adding the following css code

.myclass div {
    margin: -1.43em 0 -0.93em 0;
}

In this way, by writing this in the WP editor

badp
<div class=myclass>badp</div>
badp

the vertical spacing is changed as shown in the image

enter image description here


Next I'd like that an empty line after the div in the editor will correspond to a blank line in the webpage. That is, I'd like that by writing

badp
<div class=myclass>badp</div>

badp

the vertical spacing will be changed as shown in the image

enter image description here

I know that this can be obtained by inserting &nbsp; in the empty line, but is it possibile to achieve it by simply leaving an empty line as we usually do for normal text?

1 Answer 1

0

A solution is to create a new class, say extra-space, with css margin-bottom: 0.5em and write

<div class="myclass extra-space">...text...</div>

when the div need more space.

Important: the class extra-space has to be placed AFTER the other class in the style.css file, otherwise the extra space will not be added.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.