Guest Posted April 27, 2021 Share Posted April 27, 2021 Site URL: https://modernbusiness.squarespace.com/ Hey. How can I force an image card block on mobile & tablet to look like this Instead of this. Thank you. Link to comment
Solution Agha_Waqas Posted April 27, 2021 Solution Share Posted April 27, 2021 47 minutes ago, kristobans said: Site URL: https://modernbusiness.squarespace.com/ Hey. How can I force an image card block on mobile & tablet to look like this Instead of this. Thank you. Hi. Add below code into CSS editor @media (max-width: 900px) { #page-607e58d7db63ee562a23b8e5 { .span-6 { width: 100% !important; float: none !important; .design-layout-card { display: flex !important; justify-content: space-between !important; .intrinsic { width: calc(30% - 1%) !important; } .image-card-wrapper { margin-left: 2% !important; display: flex !important; justify-content: center !important; align-items: center !important; min-height: 100% !important; width: calc(70% - 1%) !important; } } } } } Link to comment
prcreative Posted March 25, 2022 Share Posted March 25, 2022 (edited) I'm trying to achieve the same thing, but the above code won't work. Page on website is: https://the-dead-rabbit.squarespace.com/food-menu-2 Password is: hello123 Edited March 25, 2022 by prcreative Link to comment
tuanphan Posted March 26, 2022 Share Posted March 26, 2022 20 hours ago, prcreative said: I'm trying to achieve the same thing, but the above code won't work. Page on website is: https://the-dead-rabbit.squarespace.com/food-menu-2 Password is: hello123 Add to Design > Custom CSS /* Card block mobile */ @media screen and (max-width:767px) { .image-block.sqs-block-image .design-layout-card { display: flex !important; -ms-justify-content: space-between !important; justify-content: space-between !important; } .sqs-block-image .image-block-outer-wrapper.image-block-v2 .intrinsic { width: 80% !important; } figcaption.image-card-wrapper { margin-top: 10px !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
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment