Better use of screen estate

In the Standard template, there is a large gap between the text and the right “page” border (see screen_shot). I have found no way to change it in the CSS-code (e.g. for abstract-text, there is an option margin-right: 50px;). Any suggestion is appreciated!

To the right of A) the main text there is B) some space that is used for footnotes. To the right of that there is C) space used for the margin boxes. Where in relation to A, B, C were you thinking? On smaller screens the space is used differently s there is less horizontal space to work with.

I was thinking of B). In a text with many, long footnotes, this solution is very elegant. However, if you have few or none footnotes, this space seems wasted. So I assume this is not adjustable by the user? What about an option in the template to have the footnotes at the text end even for larger screens?

It has been quite difficult to maintain the css code to make it work for both small and large screens, which is why we have not made it more configurable through a setting, but in a document template you should be able to add some css to make the space reserved for footnotes less wide, if that helps.

Can you say off the top of your head how such a code-snippet to control the footnote-space would look like? It is not part of the Standard template CSS-code, is it?

As I said, it is quite complex to write and maintain the css code that works for different screen sizes, so I would need to spend quite a bit of time writing code and checking that it works in all browsers, on all OSes and with all screen sizes.

It will take less tine if you use the develop console of your browser and find a css selector that targets B and sets a size that works for your combination of screen size, OS and preferred browser.

And no, this is not part of the default styles.

It will likely be something like

#footnote-box-container { width: 5vw !important; }

But you’ll need to investigate it yourself. In a future version we could add some settings to control the width and whether footnotes are places at the bottom even on large screens, but that will reuire development time.

This changes the width of the footnote but not the main text body. Nevermind. After all, it is more a cosmetic issue, but I still think that for the future, an option for placing footnotes at the end would come handy.

In the end I found out how to change some of the CSS-code to my liking.

.footnote-container {
margin-left: 30px;}

will place some space between the main text and the footnote.

.footnote-container p {
    font-size: 14px; }

will adjust the font-size.

.csl-bib-body { line-height: 1.5em !important; background-color:white !important; }

will change the line height and the background colour of the list of references.