Multiple fixed sidebar issue

[inspirilizationist]

I cannot seem to get two floating social media link lists to stay fixed in fixed position on opposite sides of the page at the same time. If I set them both to fixed or absolute position, they just overlap each other on one side of the page, only when I code one to relative or float position (while the other is coded for fixed) will they separate to opposite sides of the page even though they are coded to sit on opposite sides. The goal is to have them on opposite sides of the page and set to a fixed position so they hold stay put in your viewing area while you scroll up in down on the page. Currently the left side is in the correct fixed position, the other one is set to relative to stay on the opposite side of the page. Perhaps some one else has run into a similar situation and has a resolve.

Here is the link… http://www.gamesforconsciousness.com/

Thanks in advance for any advice!

[Historical Forums User]

The ul #socialbar1 has a position of “float”, which is not a valid position, rather than fixed.

[Paulie_D]

Here you go: http://codepen.io/anon/pen/GDpbF

Basically they don’t need to float at all.

[inspirilizationist]

Thanks, yeah I just replaced “float:left;” with “left:0;” , same for the right sidebar and voila, they are both fixed in their correct position on the opposite sides of the page at the same time :)

[inspirilizationist]

Oh Yeah, I also had to change the id of the side bars and each css style for them from “sidebar and sidebar1” to “left-sidebar and right-sidebar”, this was necessary!

[Author]

Posts