Jump to content

Is there any way of increasing the height of the map block on mobile only?

Recommended Posts

Hi all,

Is there any way of increasing the height of the map block on mobile only? It's currently so skinny even though the height is proportionally larger on desktop.

image.png.a530585e1855de4f008f0c09e8fa1aa5.png

I have tried these bits of CSS code without luck though I'm likely targeting the wrong object.

@media only screen and (max-width: 767px) {
.sqs-block-map{
    height: 200px !important;
}
}

 

https://projectsinsider.com/project/3-rubida-court-endeavour-hills

lifeisgood

 

Thanks!

 

Link to comment
  • Replies 2
  • Views 569
  • Created
  • Last Reply
On 9/10/2021 at 12:14 PM, Insider said:

Hi all,

Is there any way of increasing the height of the map block on mobile only? It's currently so skinny even though the height is proportionally larger on desktop.

image.png.a530585e1855de4f008f0c09e8fa1aa5.png

I have tried these bits of CSS code without luck though I'm likely targeting the wrong object.

@media only screen and (max-width: 767px) {
.sqs-block-map{
    height: 200px !important;
}
}

 

https://projectsinsider.com/project/3-rubida-court-endeavour-hills

lifeisgood

 

Thanks!

 

Hi,

It looks like you solved this?

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

Contact Customer Care - Learn CSS - Buy me a coffee (thank you!)

Link to comment
3 hours ago, tuanphan said:

Hi,

It looks like you solved this?

No I haven't actually @tuanphan.

All i changed was to keep the map block at the default size. ie the size immediately after you add the map block.

The problem still occurs when I increase the vertical height by clicking and dragging on desktop to the height that i want. When I do this, without changing the width, the vertical height on mobile decreases which is what i don't want.

Link to comment

Archived

This topic is now archived and is closed to further replies.


×
×
  • 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.