I’m learning to use twine and I don’t have much experience in coding (well I have no experience…) . I’m pretty sure my question my question will sound pretty basic to most of you.
In harlowe, how do you change the position of your text and use the side of your screen. I think there is a lot of space on both side and I would like to be able to use it. Even when I put a picture the same margin stay. I would like to reduce those margin for my whole story.
If you use your web-browser’s Web Developer Tools to Inspect the HTML elements that make up the structure of the section of the page that contents the contents of the current passage you would see something like the following.
<tw-story tags="">
<tw-passage tags="">
<tw-sidebar>
<tw-icon tabindex="0" class="undo" title="Undo" style="visibility: hidden;">↶</tw-icon>
<tw-icon tabindex="0" class="redo" title="Redo" style="visibility: hidden;">↷</tw-icon>
</tw-sidebar>
The contents of the CURRENT Passage.
</tw-passage>
</tw-story>
And if you selected the tw-story element in the above structure you would see the CSS being applied to the element that represents the main “story” area. That CSS will include a padding property like the following.
padding: 5% 20%;
This padding property is what is creating the top & bottom (5%) and left & right (20%) blank areas that appear around the section that contains the current Passage’s content. You can place CSS within your project’s Story Stylesheet area to override the default percentage (of total view-port size) values.
The following CSS changes the left & right padding to each be 18% of the view-port’s current width.
warning: the story format’s “Left Side-bar” is placed above the “Left” blank area, so if you make that area too narrow then the Left Side-bar may appear over the content of the current passage.
