caqtec

Thank you for the suggestion. It didn't work but I did eventually figure it out. I just put !important right after " writing-mode: initial;" in the media screen. Thank you for the help!

Thank you so much @tuanphan!!

Site URL: https://sra-draft2.squarespace.com/ Hello! I currently have this code on my page for the floating "Request a Sample" button on my site (code below). And it's working properly for the desktop version, but when I go on mobile I want the button to be horizontal and on the bottom right corner of the page. I've been staring at this for such a long time and I can't figure out what I'm doing wrong or missing. Thank you for the help! Password: Testing123 /* Request a Sample */ #request-a-sample { position: fixed; top: 50%; right: 0; z-index: 99999; transform: translateY(-50%); } #request-a-sample a { background: #F1944D; color: #fff; display: inline-block; font-size: 20px; font-family: AuroraGroteskB; writing-mode: vertical-rl!important; padding: 30px 8px!important; filter: drop-shadow(2px 5px 8px #222)!important; position: relative; overflow: hidden; z-index: 1; &:after { content: ''; position: absolute; bottom: 0; left: 0; width: 100%; height: 100%; background-color: #F1944D; z-index: -2; } &:before { content: ''; position: absolute; bottom: 0; left: 0; width: 0%; height: 100%; background-color: darken(#2A5697, 0%); transition: all .3s; z-index: -1; } } #request-a-sample a:hover { background: #f1944D; color: #2A5697; display: inline-block; font-size: 20px; font-family: AuroraGroteskB; writing-mode: vertical-rl; padding: 30px 8px; filter: drop-shadow(2px 5px 8px #222); color: #fff; &:before { width: 100%; writing-mode: vertical-rl; } } @media screen and (max-width: 960px) { #request-a-sample { bottom: 0; top: auto; transform: none; } } #request-a-sample a { writing-mode: initial; padding: 10px 30px; }

Hi! Yes, either one of them will work. I was trying to figure out how to do it, but for some reason I couldn't find the correct options/settings.

Hello, I was wondering if it was possible to have list item buttons to be clickable to show additional information on the same page, like an accordion? I currently have the teams page set up like this as a "List" and want to be able to click on the photo/name/position and a drop down of their contact info will show up.

Hello, I'm not sure if this is possible on Squarespace, but I want to add markers on an Image block that provides some text information about the marked area. Similar to how the orange markers on the first photo are on this site: https://archello.com/ Thank you for all the help!

This worked perfectly! Thank you!

Site URL: https://gold-bat-dxhj.squarespace.com/ceiling-systems Hello I have this code in my Custom CSS and I want to use the Flex animation for my website, but because of that, when I hover over the items in my list, a white box appears and covers the images. Can someone please help me with this issue? https://gold-bat-dxhj.squarespace.com/ceiling-systems Pass: Testing10 /* Make list images clickable */ li.list-item { position: relative !important; } .list-item-content__button-container { position: absolute !important; top: 0; bottom: 0; left: 0; right: 0; } a.list-item-content__button.sqs-block-button-element { position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 9999; color: transparent !important; background-color: transparent !important; }