Tonmeister74 Posted November 4, 2023 Share Posted November 4, 2023 Dear All, On the website www.beverlyandgregor.com I used CSS to have the footer always transparent and show the background image of the above section, which worked, wonderfully. Thank you @tuanphan for your help in previous threads! It worked like a charm. The code I used was: /* Footer transparent */ body { position: relative; } body footer#footer-sections { position: absolute; bottom: 0; left: 0; z-index: 999; width: 100%; } body footer.sections section, body footer.sections .section-background, body footer.sections .section-border { background: transparent; } Now, on the page https://www.beverlyandgregor.com/program, I have the problem, that the background image is interrupted by a second, white section, before the footer. Is there a way to have the background image from section 1 to extend through section 2 and all the way to the footer, @tuanphan? Thank you so much in advance! Best, Tonmeister Link to comment
Solution tuanphan Posted November 7, 2023 Solution Share Posted November 7, 2023 It will require some extra code First, You have a blank section at bottom of Program page, you need to delete it Next, add this code to Custom CSS section[data-section-id="65462f29c07511238234f86e"] { & { position: absolute; bottom: 0; left: 0; z-index: 999; width: 100%; padding-bottom: 200px; } &, .section-background, .section-border { background-color: transparent !important; }} @media screen and (max-width:767px) { [data-section-id="65462c39341d672e354b260c"] { padding-bottom: 900px; } } Tonmeister74 1 Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
JMVelez Posted November 19, 2023 Share Posted November 19, 2023 (edited) I'm having a similar problem in the contact page on my website (https://www.josemanuelvelez.com/contact). Instead of an image, I used the same original code to make the footer transparent and show the previous section background. But it shows a weird blank space at the end of the contact page. It doesn't happen in any of the other pages, and I checked and I don't see any additional/blank section at the end of the contact page. Any chance you could help me @tuanphan (just an amateur web designer here) Edited November 19, 2023 by JMVelez Link to comment
tuanphan Posted November 22, 2023 Share Posted November 22, 2023 On 11/19/2023 at 8:40 AM, JMVelez said: I'm having a similar problem in the contact page on my website (https://www.josemanuelvelez.com/contact). Instead of an image, I used the same original code to make the footer transparent and show the previous section background. But it shows a weird blank space at the end of the contact page. It doesn't happen in any of the other pages, and I checked and I don't see any additional/blank section at the end of the contact page. Any chance you could help me @tuanphan (just an amateur web designer here) Add this code to Website Tools (under Not Linked) > Custom CSS body { background-color: #121212; } Email me if you have need any help (free, of course.). Answer within 24 hours. Or send to forum message Contact Customer Care - Learn CSS - Buy me a coffee (thank you!) Link to comment
JMVelez Posted December 24, 2023 Share Posted December 24, 2023 thanks @tuanphan, that worked perfectly (a bit late, but I didn't have my notifications on, so I hadn't seen this reply!) tuanphan 1 Link to comment
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment