Jump to content

How to get text next to image on mobile view and not under/above?

Recommended Posts

This will require some Custom CSS to achieve this layout. To do this, start by defining the point when you want the layout to switch for mobile devices. For the purpose of this, I'll be using the Squarespace default "640px".

#mederi9 {

@media only screen and (max-width:640px) {

.sqs-col-6 {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  margin: auto;
  padding-right: 0 !important;
}

.sqs-row {
  display: flex;
  flex-direction: row;
  width: 100% !important;
  flex-wrap: nowrap;
  align-items: unset;
  justify-content: center;
  margin: auto;
  padding: 0 !important;
}

.sqs-block-image {
  display: block;
  width: 100px !important;
}

.sqs-block {
  padding-right: 0 !important;
}
		}
	}

Hope that this helps,

Dan

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.