Home › Discussions › Campaign Portal Building › Floating side bars casting shadows that block links - Campaign Portal Building Discussions on Obsidian Portal Community Forums
Floating side bars casting shadows that block links
I'm having trouble with my floating sidebar blocking links.
"https://saga-of-jaraah.obsidianportal.com/wikis/kingdoms":https://saga-of-jaraah.obsidianportal.com/wikis/kingdoms
As you scroll down the page, the links that overlap with the floating sidebar get blocked. It's as if the sidebar has a shadow on the left hand side of the page and blocks the links as it floats down while you scroll. Make any sense? I noticed the same problem on other campaigns with floating sidebars.
"For example":https://planescape-campaign.obsidianportal.com/wikis/sigil
Thanks!
Kenurion
"https://saga-of-jaraah.obsidianportal.com/wikis/kingdoms":https://saga-of-jaraah.obsidianportal.com/wikis/kingdoms
As you scroll down the page, the links that overlap with the floating sidebar get blocked. It's as if the sidebar has a shadow on the left hand side of the page and blocks the links as it floats down while you scroll. Make any sense? I noticed the same problem on other campaigns with floating sidebars.
"For example":https://planescape-campaign.obsidianportal.com/wikis/sigil
Thanks!
Kenurion
Howdy, Stranger!
It looks like you're new here. If you want to get involved, click one of these buttons!
Comments
Is it possible to do a side nav bar, like kenurion has in his site, through CSS now?
And if so, HOW????
I had to remove my Div based one after the reforge, to get my site back to functionality, but I'd like to put it back
Keelah Se'lai,
Keryth
"Shadows Over New York":http://www.obsidianportal.com/campaigns/shadows-over-new-york
"Campaign of the Month - July 2013":http://blog.obsidianportal.com/shadows-over-new-york-julys-campaign-of-the-month/
You can use CSS to style a div, though. You do it via something like:
@
Sidebar content goes here
@
Then in your custom CSS file you use:
@.sidebar-top{
position:fixed;
width:0px;
top:50px;
}
.sidebar-left{
position:relative;
right:220px;
}@
That'll allow you to control the styling of the sidebar via the CSS file, but you'll have to still add the div's manually into every page you want them to show.
Kenurion
https://campaign-52444.obsidianportal.com/wikis/the-nations
I'm not even sure if this is caused by the sidebar.
It's caused by the extra div's you're using for the other images in that six-link block in the middle of the page. For the divs containing the links to Aenoria, Osric, etc., just change the widths to 0px.
(yes, I have no computer skills whatsoever)
Any help would be appreciated.
+ is there any way of getting rid of the default links on the left side? I already tried to cover them with the sidebars but that won't work.
I don't recommend doing that unless you replace the dashboard and settings links, though, since both of those are useful.
If you want to just copy/paste them onto every page, just copy and paste the code you used for them onto every page. There's no other way to do it.
When I copy/paste the sidebar code into my other pages it goes all over the place:
https://campaign-52444.obsidianportal.com/wikis/feinns-wheel
https://campaign-52444.obsidianportal.com/wikis/vod-hin
I assume that is because everything in the code is in relation to the original content? I don't want floating sidebars, I want them locked down tight.
The sidebars floating around can be a problem, but that shouldn't happen if you put the sidebar stuff at the _top_ of each page, rather than the bottom. Alternatively, you can make the 'upper' div be position:absolute instead of position:relative, which should make it independent of the location of the rest of your content.