obrienleeanne Posted December 10, 2019 Share Posted December 10, 2019 Hi there, I am wanting to have full bleed image and background color side by side with text on the color background side, much like the Squarespace website: https://www.squarespace.com/ and see see screenshot for area I am referring too. I am wanting the 2 sides to be separately responsive so that the type is always just on the colour background. I do not have the coding knowledge to do this. Is there anyone who can help? Thank you. Link to comment
tuanphan Posted December 11, 2019 Share Posted December 11, 2019 2 column with 1 Background Image (Half image is transparent, Half image is people image). Then use CSS to create background black color. Left will have black color! 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
obrienleeanne Posted December 11, 2019 Author Share Posted December 11, 2019 Brilliant! Will give that a go. Thank you ; ) Link to comment
obrienleeanne Posted December 11, 2019 Author Share Posted December 11, 2019 Hi again, Is there a way to get the left and right column to stack? If the image is half transparent that means on mobile type runs over half of image... Thanks for any suggestions Link to comment
tuanphan Posted December 11, 2019 Share Posted December 11, 2019 27 minutes ago, obrienleeanne said: Hi again, Is there a way to get the left and right column to stack? If the image is half transparent that means on mobile type runs over half of image... Thanks for any suggestions Can you share link to your site with transparent background? I guess we can use background position attribute to adjust. 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
obrienleeanne Posted December 11, 2019 Author Share Posted December 11, 2019 Yes, here is the site: https://clarinet-strawberry-9nzf.squarespace.com/ PW: gracie You can see I have tried various methods, one being having the banner image half the intended background color (our nannies). The transparent background one shows as black (our goal) as you said in your earlier post. I just need to know if it's possible to stack that left and right sides on mobile. No stress if not possible! Thank you. Link to comment
tuanphan Posted December 11, 2019 Share Posted December 11, 2019 @obrienleeanne Have you tried Image Block yet? I remember a fews day ago, on forum, a member did this 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
obrienleeanne Posted December 11, 2019 Author Share Posted December 11, 2019 You mean have the text as part of the image block, using maybe card as the design option? I'll try that. ; ) Link to comment
tuanphan Posted December 11, 2019 Share Posted December 11, 2019 35 minutes ago, obrienleeanne said: You mean have the text as part of the image block, using maybe card as the design option? I'll try that. ; ) https://forum.squarespace.com/topic/153434-add-button-to-gallery-image/#comment-339735 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
obrienleeanne Posted December 11, 2019 Author Share Posted December 11, 2019 I used the overlap and it's working well, thank you! Just one last question: Do you know what I can do to get the image to bleed to the bottom of the block (and possibly to the side but that's not an issue really), between the pages, see screenshot. Link to comment
tuanphan Posted December 11, 2019 Share Posted December 11, 2019 16 minutes ago, obrienleeanne said: I used the overlap and it's working well, thank you! Just one last question: Do you know what I can do to get the image to bleed to the bottom of the block (and possibly to the side but that's not an issue really), between the pages, see screenshot. add to Home > Design > Custom CSS #goal .sqs-block-image { padding-bottom: 0 !important; } 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
obrienleeanne Posted December 11, 2019 Author Share Posted December 11, 2019 Genius, thank you! Much appreciate your help. Link to comment
Bdesignssc Posted February 8, 2021 Share Posted February 8, 2021 Can you elaborate on this a little more? 2 columns 1 background? Link to comment
Recommended Posts
Archived
This topic is now archived and is closed to further replies.