[Resolved] Aside – position fixed & positioning divs inside -problem

[Mag]

Hey, if you can help me out here I’ll appreciate :)

I’ve got a problem with a sidebar.. The content inside it need to be fixed (if there’s a lots of content it should scroll ). Buttons should stick to the bottom.. I’ve got problems with placing both things nicely (text on the top, buttons on the bottom) on different resolutions though. If it wouldn’t be position fixed I would use position absolute.. Is javascript required maybe?

Codepen: http://codepen.io/anon/pen/frFyb

[Mag]

[georgearnall]

Looks fine to me, unless you are referring to this. Have you got an image of how exactly you want it to look or could you tell us how you would like the element to behave?

[Mag]

georgearnall – if you press ctrl + minus in browser window – you’d get the effect I meant.. height of the text in the aside is not right.. It was based on % – that’s why..

jurotek – almost there.. but buttonContainer need to stick to the bottom of aside (or top of the footer – whatever :) )

hmmm what about counting the height of the browser’s window with javascript?

[Mag]

Unfortunately, no :(

The content need to be fixed. When scrolling main content the content of sidebar must visible all the time( top of the sidebar + buttons on the bottom of the sidebar ) ..

[georgearnall]

I am still not 100% sure what you mean. I have zoomed the page out but I am not sure what I am looking for. Anyway, does this work for you ?

[Paulie_D]

Best I can do as short notice.

http://codepen.io/Paulie-D/full/emcqo

There are some magic numbers in there (widths & heights) but those can be played with and media queries will take care of the rest.

[Mag]

Paulie_D – buttons need to stick to the bottom of the sidebar – even on 1440px heigh screen

georgearnall – yes it is almost what I wanted to achieve :) But in my case – footer is pretty high and when you are in the middle of scrolling there are too big spaces:

http://img89.imageshack.us/img89/3574/mf4m.png

Does anyone maybe know script that would detect my sroll position and attach buttons to the bottom and text to the top ( to decrease spaces..) ?

[Paulie_D]

buttons need to stick to the bottom of the sidebar – even on 1440px heigh screen

What you actually want, I think, is for the height of the sidebar to vary depending on the height of the viewport.

It seems that a JS solution is required.

Perhaps you could start a new topic / thread in the Jungle and link to this thread.

[Mag]

Yeah, you’re probably right.
Thank you guys for your help :)

[Author]

Posts