Sidebar background and border doesn't hide with the rest of the sidebar

I have a background and border on my sidebar. When I click on the “Hide sidebar” button, the sidebar disappears like it is supposed to, but the background and border remain.

The sidebar is in a fixed position with a width of 200px, but the :hover ability gives the sidebar width of 400px, which doesn’t look right when the sidebar is hidden.

Is there a way of hiding the background and border with the rest of the sidebar?

Try this :

.tc-sidebar-scrollable{
<<if-no-sidebar "display:none;">>
}

In a tiddler with the tag $:/tags/Stylesheet

1 Like

That didn’t work.

However, when I tried using this, it did work:

<<if-no-sidebar """
<style>
.tc-sidebar-scrollable {
	display: none;
}
</style>
""">>

Thanks for pointing me in the right direction!

1 Like

I’m glad you found a solution !
It should have worked though, I tested it. Did you put something other than CSS in the same tiddler with the code I provided ? Otherwise, you might have a faulty CSS stylesheet and using <style> tags prevented a parsing failure. If you want to make sure you can use this snippet in a new tiddler :

{{$:/snippets/DebugStylesheets}}

This will list your stylesheets and display a red cross next to the one with error(s) in the CSS :

image

I found the problem. The tiddler was tagged with $:/tags/PageTemplate. After switching to $:/tags/Stylesheet it worked fine.

{{$:/snippets/DebugStylesheets}} didn’t find any errors.

Thanks for the help!