bawebb123 Posted March 29, 2022 Share Posted March 29, 2022 Site URL: https://oakpointpartners.com/corporate-remnants I have code that spans 5 image blocks across a screen that I like having on desktop //Full span 5 image blocks @media screen and (min-width:767px){section[data-section-id="623a4543be9cf7660e3aef87"] { .sqs-col-3, .sqs-col-2 { width: 20% !important; } }} However, on mobile, all images and text blocks stack on top of each other. Is there a way to display the images in two columns? Ex below: XX XX X ------------------ Also, separate question. Is there a way to display a different favicon for one specific webpage? Link to comment
tuanphan Posted April 1, 2022 Share Posted April 1, 2022 You mean Team People? Don't remove any code in your current code. Add this to Design > Custom CSS /* corporate-remnants - mobile team 2 columns */ @media screen and (max-width:767px) { div#page-section-623a4543be9cf7660e3aef87>.row>.col { width: 50% !important; float: left !important; } div#page-section-623a4543be9cf7660e3aef87>.row>.col:nth-child(2n+1) { clear: 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
bawebb123 Posted April 15, 2022 Author Share Posted April 15, 2022 @tuanphan I added people to my "Meet the Deal Team" section. Can you amend the code so the bottom 4 people are centered on desktop? Also, I think the mobile code needs to be fixed. They should be displayed as: EL MC JM MR AK MP JA CC RP https://oakpointpartners.com/corporate-remnants Link to comment
bawebb123 Posted April 15, 2022 Author Share Posted April 15, 2022 Nevermind about centering the images withing the section. I found code to make it work. However, the mobile code to show the people in two columns does not work still and I'll need help. Thanks tuanphan 1 Link to comment
tuanphan Posted April 18, 2022 Share Posted April 18, 2022 Add to Design > Custom CSS /* Team mobile */ @media screen and (max-width:767px) { div#page-section-623a4543be9cf7660e3aef87>.row { width: calc(!"50% - 20px") !important; float: left !important; } div#page-section-623a4543be9cf7660e3aef87>.row:first-child { margin-right: 40px; } } 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
bawebb123 Posted April 26, 2022 Author Share Posted April 26, 2022 Hey @tuanphan, when I go to paste the code, it says there's a syntax error in the following line: width: calc(!"50% - 20px") !important; Link to comment
tuanphan Posted April 29, 2022 Share Posted April 29, 2022 On 4/26/2022 at 10:38 PM, bawebb123 said: Hey @tuanphan, when I go to paste the code, it says there's a syntax error in the following line: width: calc(!"50% - 20px") !important; ah sorry, missing a symbol, change ! to ~ It should be width: calc(~"50% - 20px") !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