tommmmusic Posted January 11, 2023 Share Posted January 11, 2023 (edited) Just renewed my website for another year, only to find that the Mobile version has a big space whenever I embed a Spotify playlist; this looks awful and so unprofessional. For a musician who depends on playlists, the majority of which are Spotify tunes, I need it to look good - at the moment, there is a huge empty space on my page under EVERY playlist (the yellow I added is the space I wish to remove): Can someone pls advise how to remove this blank space, and how to change the code so that the playlist is not minimised to a window that you have to scroll on. Thanks for your help! Edited January 11, 2023 by tommmmusic Link to comment
tommmmusic Posted January 14, 2023 Author Share Posted January 14, 2023 Does anyone have any solutions to this? Many thanks! @tuanphan @creedon Link to comment
tommmmusic Posted January 15, 2023 Author Share Posted January 15, 2023 I noticed on @CalvinEKyour site, even on mobile version, you managed to embed a Spotify player with only a small gap (padding) under your playlist - could you share the code you used to get this to work? Many thanks! Link to comment
tuanphan Posted January 17, 2023 Share Posted January 17, 2023 Can you share link to page in screenshot? 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
tommmmusic Posted January 18, 2023 Author Share Posted January 18, 2023 Sure! Page is: https://www.tommmatthews.com/projects/tv-drama Many thanks! Link to comment
tuanphan Posted January 20, 2023 Share Posted January 20, 2023 On 1/19/2023 at 4:06 AM, tommmmusic said: Sure! Page is: https://www.tommmatthews.com/projects/tv-drama Many thanks! Add to Design > Custom CSS @media screen and (max-width:767px) { div#block-yui_3_17_2_1_1673746598493_19432 .embed-block-wrapper { padding-bottom: 30% !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
tommmmusic Posted January 21, 2023 Author Share Posted January 21, 2023 Hey @tuanphan, thanks so much - that works great with one block (Spotify player), but if i try to apply that code as a list to the other Spotify playlists on the page, it doesn't work... If you see how I've tried to add multiple, you'll see the effect it has on the page... Question: How can I write a code for all 4 playlists on the page? Many thanks! Here is the code: Quote @media screen and (max-width:767px) { div#block-yui_3_17_2_1_1673746598493_19432, #block-5f5bf147cd3a23fd488f .embed-block-wrapper { padding-bottom: 25% !important; } The coding for the first playlist doesn't work (div#block-yui_3_17_2_1_1673746598493_19432) but the second does First playlist: Second playlist: Thanks! Link to comment
tuanphan Posted January 26, 2023 Share Posted January 26, 2023 Hi, It looks like you figured it out? 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
tommmmusic Posted January 28, 2023 Author Share Posted January 28, 2023 On 1/27/2023 at 1:56 AM, tuanphan said: Hi, It looks like you figured it out? Hey Tuanphan, I basically copied the code and repeated it for each separate block. I think no need to group them together, no difference right? Thanks again! Link to comment
tuanphan Posted February 2, 2023 Share Posted February 2, 2023 Yes. Or you can combine them, something like this @media screen and (max-width: 767px) { div#block-yui_3_17_2_1_1673746598493_19432 .embed-block-wrapper { padding-bottom:25% !important; } div#block-5f5bf147cd3a23fd488f .embed-block-wrapper { padding-bottom:25% !important; } div#block-61658798d199cd48c9e9 .embed-block-wrapper { padding-bottom:25% !important; } div#block-yui_3_17_2_1_1651622547412_63949 .embed-block-wrapper { padding-bottom: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
oliviapalacios Posted December 6, 2023 Share Posted December 6, 2023 @tuanphan is there also a way to uncurve the corners of the Spotify embed player? I would like them to be square. Link to comment
tuanphan Posted December 7, 2023 Share Posted December 7, 2023 On 12/6/2023 at 8:02 AM, oliviapalacios said: @tuanphan is there also a way to uncurve the corners of the Spotify embed player? I would like them to be square. If you share link to page where you use Spotify, I can check 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
oliviapalacios Posted December 14, 2023 Share Posted December 14, 2023 @tuanphan Thank you! Here is the page: https://jellyfish-gold-ysc4.squarespace.com/music/project-one-h346n-sbkja PW: booch Let me know if you can help! Link to comment
tuanphan Posted December 16, 2023 Share Posted December 16, 2023 On 12/15/2023 at 1:06 AM, oliviapalacios said: @tuanphan Thank you! Here is the page: https://jellyfish-gold-ysc4.squarespace.com/music/project-one-h346n-sbkja PW: booch Let me know if you can help! Can you check it again? 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
oliviapalacios Posted December 16, 2023 Share Posted December 16, 2023 10 minutes ago, tuanphan said: Can you check it again? @tuanphan did you try refreshing the page? it's appearing for me right now. Link to comment
tuanphan Posted December 17, 2023 Share Posted December 17, 2023 On 12/16/2023 at 11:11 AM, oliviapalacios said: @tuanphan did you try refreshing the page? it's appearing for me right now. I can't find a way to fix it, the element created round corner is in iframe tag, no way to control it. oliviapalacios 1 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