Okay, so I realize that the title is very confusing to get what the issue is about but essentially, when I organize my code, I like to hit enter after every new element. Example below:
<<add-time>>
<span id="regular-content">
test
<<button "Test">>
<<goto [[Test]]>>
<</button>>
</span>
The issue is that when I’m playing the game I see the spacing get really crazy like this:
Do I have to change how I write the code to reduce the space between the top of the screen and the bottom? I tried other ways to write the code like so:
But it still takes up a bunch of space at the top for no reason. Sorry if this seems like a dumb issue to be confused on, but it’s kind of annoying to see the spacing between passages vary so much.
There are a couple things you can do. You can use the line continuation markup, putting a / before every line break you don’t want to appear in the passage:
More drastic solutions would be to tag the whole passage nobr (this removes line breaks from the entire passage), add Config.passages.nobr = true; to the Javascript section (this removes line breaks from the entire game).
I’m not too sure if I’m doing something wrong, but when I copy and paste either of these into the passage, the space between the passage and the top of the screen is smaller than before, however, there’s still quite a large gap.
But this pretty much solved all my problems including the <br>. Also from my understanding, I should use <br> before I want the line break?
Thanks for the answers and notes. Sorry if this was a question for something pretty easy to solve.
The <span> HTML element is designed to display inline-level content, but you are it to display content in a block-level like manner.
eg. the content within your <span> includes a line-break so it is laid out over multiple lines…
Ideally the <span> should be replaced with a block based element like <div> Preformatted text.
The following a <div> based variations of @svlin 's examples…
There is automatically a small bit of space between the passage top and top of the window, but certainly not as much as you are showing.
Do you have a header tagged passage? If so, it is prepended to the top of your passages, and so any line-breaks inside it will cause the same issues as the ones in the passage. Alternatively, do you have any custom Stylesheet code that could be adding more padding or margin to the passage?
If you examine the page in your browser’s dev tools (in Firefox/Chrome, right-click the passage and choose “Inspect”) you should be able to see if the gap is inside or outside of the passage itself.