0 votes
by (160 points)
Hey there,

Is there a way to adjust the space between paragraphs? I want to leave some empty space between paragraphs but a full empty line is too much. Looking for a way to fine tune.

I'm using the most current version of Twine 2 with Harlowe. I have problems using stylesheets (they just don't work), so ideally there would be some solution with a Harlowe-code passage.

Thanks a lot!

1 Answer

+1 vote
by (159k points)

Please use the Question Tags to state the name and full version number of the Story Format (and possible the Twine application) you are using, instead of including that information within the Question itself.
The full version number is needed because each version of a particular story format can have different features, so knowing the version can help the person answering give a more precise answer.
I am going to amuse you are using the latest version of Twine 2 and the latest version of Harlowe 2, as that is the default story format. 

You didn't include an example of what you are considering a 'paragraph', and there are at least two different things that it could be.

1. Blocks of text with two line-breaks between them.

The quick brown fox jumped over the lazy dog.

The quick brown fox jumped over the lazy dog.

In this use-case the two line-breaks are converted into two sequential HTML br elements and you need to adjust the style of the second of these br elements, unfortunately this may not be easy to do in a way that is supported by all web-browsers.
The CSS needs target the second element and remove its content then adjust the size of it's top margin, which is what gives the element it's height once the content has been removed. The following CSS should do this, and it should be places withing the Story Stylesheet area of your story project.

br+br {
	content: "";
	display: inline-block;
	margin-top: 1em;
}

... adjusting the value assigned to the margin-top property will alter the gap between the two blocks of text.

2. Blocks of text wrapped within HTML Paragraph elements.

{
<p>The quick brown fox jumped over the lazy dog.</p>
<p>The quick brown fox jumped over the lazy dog.</p>
}

In this use-case the gap between the two blocks of text are controlled by the p element's default top and bottom margins, placing CSS like the following within your Story Stylesheet area allows you to change there default values.

p {
	margin-top: 0;
	margin-bottom: 0.5em;
}

... adjusting the value assigned to the margin-bottom property (or the margin-top property, or both) will alter the gap between the two blocks of text.

...