-
Posts
-
Hello
I’m trying to get 2 images/text to sit at the bottom right and left of my home page – so that they hug the bottom and sides as the page is resized (in the same way the logo and menu hug the top and sides as you move the window around).I have a color section that takes up the 100% height with a background image and have placed the content I want in 3 columns, but do not want that to go wider than 1310px in width.
I have the other 2 images and text that I want at the bottom, but have put them in code blocks (with position: fixed) so that they hug the bottom and sides. The problem is when you scroll, the images go with it.
I’ve attached a screenshot of how I want it to look and have put the web address in the private content
https://www.dropbox.com/s/uoi4khnb67lnfhf/Screenshot%202021-01-07%20at%2017.41.00.png?dl=0
Hopefully I have explained this well.
Many thanks
Richard
Hey rescott72,
Thank you for the inquiry.
You may need to set the position property of the text or code block element containing the images to absolute instead of fixed so that they are positioned relative to the parent container, and so that they do not scroll along with the document. Have you tried that?
Best regards,
IsmaelThanks Ismael
Unfortunately that relates to the container width (set at 1310px) and not the 100% width I would like. As I want the rest of the content to sit within the 1310px, I think its difficult to get the content I want to sit outside it.
I have found away around it though. I have created another color section, given it 100% width and min-height of 0px. Ive then put a code block on there with the absolute position. The image now sits where I want it to and scrolls. Not sure if this is the best way to do it, but it works for now.
Many thanks
Richard
- You must be logged in to reply to this topic.