Firstly I apologise for being very novice and, as a result, not knowing the correct terminology. I hope I can make myself understood but let me know if anything I say is unclear).
For various elements across my site (a blog/online magazine) I want to have fixed elements, but that are fixed within their own containers and relative to the other elements on the page (for example I want the blog logo to cover the top left of the scrollable post thumbnails on the homepage and, on the same page, a fixed element with social media links to be always covering part of the bottom right of the scalable post thumbnails). At the moment all I have managed is to fix an element relative to the outer edges of the page which obviously does not always position it over the post thumbnails in the same way every time.
Another similar issue is the sidebar on the post page. On this page I have a section with a container and two rows (left being the sidebar and the right being the rich text post). I want to have at the top of the sidebar, the first column, to be the logo and at the bottom of the screen (i.e. not the bottom of the page) another logo. When you resize the height of the browser window I want the two elements to always be at the top and bottom of that column.
I'd be so grateful for any help on this, even if it's just to direct me to a post that explains things (I have had a look but I think I am restricted my lack of correct terminology etc.)
Thanks in advance,