michael_n Posted April 4, 2021 Share Posted April 4, 2021 Site URL: https://liptovskydvor.sk Hello all, I would like to ask for help with aligning text block within section on my title page. I would like to have top left alignment for desktop version, but have different, bottom alignment for mobile version. I also need the subtle background overlay so the text does not blend into the image: The block ID is: block-yui_3_17_2_1_1617563024648_5628 My CSS code so far: /* bkg overlay mobile title block and alignment */ @media screen and (max-width:640px) { #block-yui_3_17_2_1_1617563024648_5628 { background-color: rgba(255, 255, 255, 0.80) !important; } } Many thanks for any help. Michael Beyondspace 1 Link to comment
Solution Beyondspace Posted April 5, 2021 Solution Share Posted April 5, 2021 3 hours ago, michael_n said: Site URL: https://liptovskydvor.sk Hello all, I would like to ask for help with aligning text block within section on my title page. I would like to have top left alignment for desktop version, but have different, bottom alignment for mobile version. I also need the subtle background overlay so the text does not blend into the image: The block ID is: block-yui_3_17_2_1_1617563024648_5628 My CSS code so far: /* bkg overlay mobile title block and alignment */ @media screen and (max-width:640px) { #block-yui_3_17_2_1_1617563024648_5628 { background-color: rgba(255, 255, 255, 0.80) !important; } } Many thanks for any help. Michael You can use @media screen and (max-width: 640px) { section[data-section-id="60507e90a2c0da511d88d87f"] { align-items: flex-end !important; } section[data-section-id="60507e90a2c0da511d88d87f"] .content-wrapper { padding-bottom: 4vw !important; } } #block-yui_3_17_2_1_1617563024648_5628 { background-color: rgba(255,255,255,.8) !important; } tuanphan 1 BeyondSpace - Squarespace Website Developer 🖼️ Lightbox Studio (Enable Pinch/Zoom on lightbox) 🗓️ Delivery Date Picker (Squarespace Date format) 💫 Animated Buttons (Referral URL) 🥳 Sparkplugin Customisations Browsers (Browse +100 Spark plugin customisations) 🥳 Elfsight Template Browsers (Browse +1000 Elfsight widget Templates) If you find my answer useful, let's leave a like or upvote so others with the same issue can find their solution. Thank you! Link to comment
michael_n Posted April 5, 2021 Author Share Posted April 5, 2021 Hello @bangank36 Many thanks for your help, it worked exactly like I needed . Have a nice day. Beyondspace 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