chauncey_peppertooth Posted March 27, 2023 Share Posted March 27, 2023 Trying to figure out how to offset the portfolio columns, but can't figure it out. Would love to get a 70/30 split like the attached image. Any assistance would be greatly appreciated!! Link to comment
TJC123 Posted March 28, 2023 Share Posted March 28, 2023 Bumping this topic as i'm also looking for it. Inspiration from this site: Morrama - Product Development | Industrial Design | London Link to comment
tuanphan Posted April 2, 2023 Share Posted April 2, 2023 We can do this, but with custom CSS code. If you share link to portfolio page on your site, we can check code easier 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
chauncey_peppertooth Posted April 6, 2023 Author Share Posted April 6, 2023 (edited) @tuanphanhttps://evngrgdsn.com/ there is some custom css in there now to sort of fake the effect, let me know what you're thinking! Edited April 6, 2023 by chauncey_peppertooth Link to comment
tuanphan Posted April 8, 2023 Share Posted April 8, 2023 On 4/7/2023 at 4:15 AM, chauncey_peppertooth said: @tuanphanhttps://evngrgdsn.com/ there is some custom css in there now to sort of fake the effect, let me know what you're thinking! I see you current layout is 2 - 1 - 2 - 1... Do you still need help to change to this layout? 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
chauncey_peppertooth Posted April 8, 2023 Author Share Posted April 8, 2023 @tuanphan Yes, please! I would rather have the stacked/staggered effect than the 2-1-2-1 split as it is Link to comment
tuanphan Posted April 12, 2023 Share Posted April 12, 2023 On 4/9/2023 at 4:13 AM, chauncey_peppertooth said: @tuanphan Yes, please! I would rather have the stacked/staggered effect than the 2-1-2-1 split as it is Add to Design > Custom CSS div#gridThumbs { grid-template-columns: repeat(5,1fr) !important; } a.grid-item:nth-child(1), a.grid-item:nth-child(5) { grid-column: ~"1 / 4"; } a.grid-item:nth-child(2), a.grid-item:nth-child(6) { grid-column: ~"4 / 6"; } a.grid-item:nth-child(3) { grid-column: ~"1 / 3"; } a.grid-item:nth-child(4), a.grid-item:nth-child(6) { grid-column: ~"3 / 6"; } a.grid-item:nth-child(1) a.grid-item, a.grid-item:nth-child(1) .grid-image, a.grid-item:nth-child(4) a.grid-item, a.grid-item:nth-child(4) .grid-image, a.grid-item:nth-child(5) a.grid-item, a.grid-item:nth-child(5) .grid-image { padding-bottom: 50% !important; } a.grid-item:nth-child(2) a.grid-item, a.grid-item:nth-child(2) .grid-image, a.grid-item:nth-child(3) a.grid-item, a.grid-item:nth-child(3) .grid-image, a.grid-item:nth-child(6) a.grid-item, a.grid-item:nth-child(6) .grid-image { padding-bottom: 76.25% !important; } 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
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment