Adjust the fixed sidebar in Icon stack

[SwissArmyKnife]

Hi. I selected a demo of the Icon stack that uses a fixed sidebar. It is fixed to the right side of the browser window, On my 32" 4k monitor, that sidebar is separated from the page content by almost 6" of physical space. It is unnoticeable.

• Can I add a right margin to it or a transparent right border to it when the screen width exceeds a certain number of pixels? If I can do that, my very colorful page background image will be visible to the right of the sidebar.

• If I can’t do that, can I override the CSS that ‘fixes’ it to the right side of the screen, placing it 30px to the right of the content?

• Or is it just easier to select a demo from a different stack?

Thank you.

[friech]

Hi @SwissArmyKnife,

Thank you for writing in, please add this to Theme Options > CSS

@media (min-width: 1600px) {
.x-content-sidebar-active .x-sidebar {
    	right: 100px;
	}
}

Feel free to adjust those values as you see it fits, the 1600px is the size of the screen (and up) when you want this custom CSS to be trigger. The 100px is the distance of sidebar from the right edge.

Hope it helps,
Cheers!

[SwissArmyKnife]

That works! Thank you very much.

[Prasant]

You are most welcome.