Want to protect your cyber security and still get fast solutions? Ask a secure question today.Go Premium

x
  • Status: Solved
  • Priority: Medium
  • Security: Public
  • Views: 322
  • Last Modified:

Sticky sidebar pops out

Head over to here
Scroll down a bit and you will see the sidebar becomes sticky but it overlaps the main content - you will need your browser at 1100px or more to see it
It's like its ignoring the container width.

This is the plugin I'm using http://stickyjs.com/
0
Gary
Asked:
Gary
  • 2
1 Solution
 
ramyajanarthananCommented:
In your page initially position is set to static and when scrolled set to fixed.

try setting your class=left-sidebar

position:absolute;
float:left;
and left,right alignments.

I hope the problem is due to positioning.width of left bar as I'm not able to check since i don't have your exact code and on firebug on scrolling the style gets changed.
0
 
GaryAuthor Commented:
position:absolute is not a fix - that will only mess up the whole layout.
0
 
David S.Commented:
The problem is due to the percentage width interacting with how the script works. You see before you scroll down the sidebar has "position:static" but after you scroll down it has "position:fixed". "position:fixed" causes the sidebar's "positioning context" to be different, so the percentage width refers to the width of the <html> element instead of that of ".wrap". It looks like the simplest solution would be to simply give "max-width: 238px" to ".left-sidebar".
0
 
GaryAuthor Commented:
static is set by the plugin because it clones the object and it is the cloned object that has position:fixed but..
Adding a max-width fixes it, almost, it still extends a bit at smaller resolutions but I can live with that as it doesn't extend to the main content.
0

Featured Post

Receive 1:1 tech help

Solve your biggest tech problems alongside global tech experts with 1:1 help.

  • 2
Tackle projects and never again get stuck behind a technical roadblock.
Join Now