madseason Posted September 29, 2022 Share Posted September 29, 2022 (edited) Hello, I added a list section to 2 pages on my website and the button alignment is off probably due to the pictures as displayed below. I tried to adjust the picture settings ratio and that did not help any. I need to make sure the whole picture is displayed but not have it impact the button placement. I put the links to the impacted pages up in the header (stock market dashboard and cryptocurrency dashboard). The list section is called charts of interest and is down at the bottom of the page. Thanks in advance for the help! Edited September 29, 2022 by madseason Link to comment
joseph81 Posted September 29, 2022 Share Posted September 29, 2022 (edited) [data-section-id="632eff2b9822c24d60444278"] .list-item-media { flex:1 } This should do the trick ! Edited September 29, 2022 by joseph81 madseason 1 Jozsef Kerekes - Front-end developer and Squarespace enthusiast My Blog: https://ui-workarounds.comIf you like my answer, please give me an upvote/like. Highly appreciated. Link to comment
madseason Posted September 29, 2022 Author Share Posted September 29, 2022 (edited) Huge improvement! Thank you. Target & Walmart are off just a bit. Edited September 29, 2022 by madseason Link to comment
joseph81 Posted September 29, 2022 Share Posted September 29, 2022 I would like to help further but I don't have access to this section anymore. madseason 1 Jozsef Kerekes - Front-end developer and Squarespace enthusiast My Blog: https://ui-workarounds.comIf you like my answer, please give me an upvote/like. Highly appreciated. Link to comment
madseason Posted September 29, 2022 Author Share Posted September 29, 2022 Links are available again. Thanks for looking into! Link to comment
joseph81 Posted September 29, 2022 Share Posted September 29, 2022 (edited) [data-section-id="632eff2b9822c24d60444278"] .user-items-list .user-items-list-item-container .list-item .list-item-content { flex: 0 auto; } I've added so much selectors there, because of specificity ! There was another rule that was higher in specificity and I needed to overrule that. Edited September 29, 2022 by joseph81 madseason 1 Jozsef Kerekes - Front-end developer and Squarespace enthusiast My Blog: https://ui-workarounds.comIf you like my answer, please give me an upvote/like. Highly appreciated. Link to comment
madseason Posted September 29, 2022 Author Share Posted September 29, 2022 Replaced old code with the new code. Similar alignment issues just in different areas of the list section. Link to comment
joseph81 Posted September 29, 2022 Share Posted September 29, 2022 (edited) Yes because you also took out the first code that I suggested. You can group them together:[data-section-id="632eff2b9822c24d60444278"] { .list-item-media { flex:1 } .user-items-list-item-container .list-item .list-item-content { flex: 0 auto; } } Edited September 29, 2022 by joseph81 madseason 1 Jozsef Kerekes - Front-end developer and Squarespace enthusiast My Blog: https://ui-workarounds.comIf you like my answer, please give me an upvote/like. Highly appreciated. Link to comment
madseason Posted September 29, 2022 Author Share Posted September 29, 2022 Ah! I have both in now. Looks amazing! Thank you! Can I use the same code for the cryptocurrency dashboard but just replace the section id? Link to comment
joseph81 Posted September 29, 2022 Share Posted September 29, 2022 [data-section-id="632eff2b9822c24d60444278"], [data-section-id="6330ecb9ad4dd44a5c34c8be"] { .list-item-media { flex:1 } .user-items-list-item-container .list-item .list-item-content { flex: 0 auto; } } madseason 1 Jozsef Kerekes - Front-end developer and Squarespace enthusiast My Blog: https://ui-workarounds.comIf you like my answer, please give me an upvote/like. Highly appreciated. Link to comment
madseason Posted September 29, 2022 Author Share Posted September 29, 2022 (edited) That is fabulous! Looks great! Thank you for your help! Edited September 29, 2022 by madseason Link to comment
joseph81 Posted September 29, 2022 Share Posted September 29, 2022 (edited) You could create a separate issue with this problem. Doesn't looks like an easy one. Also if you think I answered the main question please choose my answer as the main answer. Edited September 29, 2022 by joseph81 madseason 1 Jozsef Kerekes - Front-end developer and Squarespace enthusiast My Blog: https://ui-workarounds.comIf you like my answer, please give me an upvote/like. Highly appreciated. Link to comment
madseason Posted September 29, 2022 Author Share Posted September 29, 2022 How do I select that you answered the main question? Is it just the thumbs up? Don't see another option anywhere. Link to comment
joseph81 Posted September 29, 2022 Share Posted September 29, 2022 I would be grateful for a vote up. If you post the other issue separately, I will also take a look tomorrow. Thank you. madseason 1 Jozsef Kerekes - Front-end developer and Squarespace enthusiast My Blog: https://ui-workarounds.comIf you like my answer, please give me an upvote/like. Highly appreciated. Link to comment
madseason Posted September 29, 2022 Author Share Posted September 29, 2022 Done! You are awesome! Link to comment
joseph81 Posted September 29, 2022 Share Posted September 29, 2022 I'm glad that I could help you (at least with the first issue). madseason 1 Jozsef Kerekes - Front-end developer and Squarespace enthusiast My Blog: https://ui-workarounds.comIf you like my answer, please give me an upvote/like. Highly appreciated. Link to comment
madseason Posted September 29, 2022 Author Share Posted September 29, 2022 Progress! I understand these things can take a bit of time. 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