Harlowe: CSS Help - Three screen divisions, two with independent scrollbars

[working with 2.0, Harlowe]
Good evening. I want to divide the screen in my game in the following way:
One little static sidebar for save/restore and inventory. I called this "SideBar".
One main section where the general passage is displayed, and that occupies about half the screen - preferentially a little bit more.
One "Contextual Info" section that displays dialog and actions options and descriptions of itens as the player interacts with them in the first section - and which occupies the other (horizontal) half of the screen - preferentially a little bit less. This is "dialogBox".

Having no knowledge in CCS, this is what i tried with modified codes from other times i asked for help here (thanks btw :3):

tw-passage tw-include[title="SideBar"] {
	width: 15em;
	position: absolute;
	left: -9em;
	top: 0;
	padding: 0.5em;
	text-overflow: clip
}

tw-passage tw-include[title="dialogBox"] {
	width: 15em;
	position: absolute;
	left: 0em;
	right: 0em;
	top: 0;
	padding: 15.5em;
	text-overflow: clip
}

I thought it would be easy to just adjust the values and looked into the argument "absolute". Well, after i changed it to "relative" and things went full weird, i thought better to come to you again.
Not enough - i realized that in very long passages it wouldn't be good for the player to have to scroll all the away up everytime s/he wishes to check inventory. So, i thought about the two independent scrollable boxes working along with the static inventory section. I hope it isn't much of a trouble.
Thank you very much.