Jump to content
Go to solution Solved by tuanphan,

Recommended Posts

I have two questions, but they may be linked. 

First Question: I have a code block for a rotating "let's chat" on the home page. However, the circle distorts depending on the screen size. How do I lock it in a circle?

<a href="/contact"><center><img src="https://static1.squarespace.com/static/62a06f7de4500f5c95bd5f24/t/6434a57aada4621387b238a8/1681171834706/Pocket+Digital_LetsChat.png" class="rotate" width="170" height="170" />
</center></a>
<style>
  .rotate {
  animation: rotation 8s infinite linear;
}

@keyframes rotation {
  from {
    transform: rotate(359deg);
  }
  to {
    transform: rotate(0deg);
  }
}
</style>

Second Question: Also on the home page, I have an ifram that pops out of the frame depending on the screen size (which results in it going over the textblock). How do I lock this down so it scales better?

 <iframe src="https://player.vimeo.com/video/818621743?h=79c21bc738" width="340" height="564" frameborder="0" allow="autoplay; fullscreen" allowfullscreen></iframe>

 

Screenshot 2023-04-28 at 7.23.48 PM.png

Screenshot 2023-04-28 at 7.24.06 PM.png

Link to comment
  • Replies 4
  • Views 188
  • Created
  • Last Reply

Top Posters In This Topic

Create an account or sign in to comment

You need to be a member in order to leave a comment

×
×
  • Create New...

Squarespace Webinars

Free online sessions where you’ll learn the basics and refine your Squarespace skills.

Hire a Designer

Stand out online with the help of an experienced designer or developer.