0 votes
by (240 points)
edited by
Using Harlowe 2.1.0. Not sure what I'm doing incorrectly here but the text of my project is only using 50% of the available screen and is rather squished because of it:

    width: 100%;

display: none;

I've tried different percentages of the above but nothing has changed. EDIT: So going above 100% does make the text use up more of the space on the right side but there's still the sidebar on the left taking up space even though it has no elements. Can that sidebar be deleted entirely?

1 Answer

+2 votes
by (156k points)
selected by
Best answer

If you use your web-browser's builtin Web Development Tools to Inspect the HTML elements that make up the page (and the associated CSS) you will see that the tw-story element has a left & right padding of 20%, and this is what is causing the blank areas to either side of the main passage area.

You can use CSS like the following within the Story Stylesheet area to reduce the size of that padding so that it is the same as the top & bottom.

tw-story {
	padding: 5%;

... this however will not get rid of the 'side-bar' content.

> Can that sidebar be deleted entirely?
The 'side-bar' is actually a repositioned special header, which you can visually suppress by adding CSS like the following to the same Story Stylesheet area.

tw-sidebar {
	display: none;


Welcome to Twine Q&A, where you can ask questions and receive answers from other members of the community.

You can also find hints and information on Twine on the official wiki and the old forums archive.

See a spam question? Flag it instead of downvoting. A question flagged enough times will automatically be hidden while moderators review it.