Jump to content

Arrange divs next to each other on mobile

Recommended Posts

Site URL: https://walsh-prop.squarespace.com/

Site password: walsh

I'm optimizing my client's site for mobile and I cannot get a few divs in the footer to sit next to each other. My goal is to have them look similar to this:

1450959344_ScreenShot2022-01-27at12_53_30PM.png.4c7d9a74cdcc8d0833ad4a8796fff491.png

 

With many failed attempts with CSS to get them to float next to each other, this is as far as I have gotten (with the code on the left):

367616852_ScreenShot2022-01-27at12_50_24PM.thumb.png.7f16cc107c960c64a258f3f8ef5d18b9.png

 

Any help would be greatly appreciated!

Link to comment
2 hours ago, 2birds said:

Site URL: https://walsh-prop.squarespace.com/

Site password: walsh

I'm optimizing my client's site for mobile and I cannot get a few divs in the footer to sit next to each other. My goal is to have them look similar to this:

1450959344_ScreenShot2022-01-27at12_53_30PM.png.4c7d9a74cdcc8d0833ad4a8796fff491.png

 

With many failed attempts with CSS to get them to float next to each other, this is as far as I have gotten (with the code on the left):

367616852_ScreenShot2022-01-27at12_50_24PM.thumb.png.7f16cc107c960c64a258f3f8ef5d18b9.png

 

Any help would be greatly appreciated!

Can you share the link to this page?

image.thumb.png.aa4bd7f0fea037f53b7345558a1ecc48.png

I can not see any navigator on Home Page

Greeting, it's BeyondSpace, I am Squarespace dev focus on provide solutions to enhance feature that squarespace.com can't provide.
Feel free to check my current Squarespace Plugins Developement: Enable Pinch/Zoom on lightbox, Delivery Date Picker, Keyword Highlighter
If you find my answer fit your need, let's leave a like or upvote so others with the same issue can find their solution. Thank you

Link to comment
On 1/29/2022 at 3:07 AM, 2birds said:

Yes, sorry about that! You can see the footer on this page: www.walsh.properties/home 

Don't remove any code in your current code

Add this to Design > Custom CSS

/* footer people */
@media screen and (max-width:767px) {
div#block-yui_3_17_2_1_1643145017474_99687 {
    width: 30% !important;
    float: left !important;
}
}

 

Email me if you have need any help (free, of course.). Answer within 24 hours. 
Or send to forum message

How to: Setup Password & Share url Insert Custom CSS - Page Header - Upload Custom Font - Upload File - Find Block ID - Contact Customer Care

Link to comment

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.