Two buttons, [[BACK]] AND [[FORWARD]] placed on opposite sides of the same line that maintain their position even when the page changes size

[Bellerofonte]

What am I doing:

I use this code:

<div style="width:100%;"> 
    <div style="float:left;">BACK</div> 
    <div style="float:right;">FORWARD</div> 
</div>

What I get:

Due stringhe “BACK” e “FORWARD” allineate ai bordi opposti della medesima riga.

What I want to achieve:

Two buttons, [[BACK]] AND [[FORWARD]] placed on opposite sides of the same line that maintain their position even when the page changes size.

I have no programming knowledge, I have been using Obsidian for 3 weeks, and I try to make myself understood in English. Please use layman’s language.

PS:

I tried this too <span class="left">**[[BACK]]** <span class="float-right">**[[FORWARD]]** </span> but the [[button] on the right is closer to the one on the left instead of on the opposite side of the row.

[efemkay]

you should use div and then display: flex with justify-content: space-between to spread to both ends, as per example below. do note that when you’re typing to ensure you type straight quotes "" as opposed to curly “” (ref here: Straight and curly quotes | Butterick’s Practical Typography)

also replace # after href= to file location or url you want.

<div style="display: flex; justify-content:space-between;">
	<div><a href="#">BACK</a></div>
	<div><a href="#">FORWARD</a></div>
</div>

[Bellerofonte]

@efemkay

<div style="display: flex; justify-content:space-between;">
	<div><a href="#">BACK</a></div>
	<div><a href="#">FORWARD</a></div>
</div>

Thanks