arielestulin Posted September 23, 2020 Posted September 23, 2020 Site URL: https://www.physiobysteph.com/ In mobile view how do I prevent the LOOK AROUND and SERVICES blocks from breaking and remain side-by-side.
tuanphan Posted September 25, 2020 Posted September 25, 2020 Add to Home > Design > Custom CSS /* footer links side by side */ @media screen and (max-width:767px) { div#page-section-5f5a8ef3230b5552772b0d6d .span-12>.row>.span-2 { width: 50% !important; float: left !important; } div#page-section-5f5a8ef3230b5552772b0d6d .span-12>.row>.span-3 { clear: left; } } 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!)
Guest Posted January 2, 2021 Posted January 2, 2021 On 9/24/2020 at 7:59 PM, tuanphan said: Add to Home > Design > Custom CSS /* footer links side by side */ @media screen and (max-width:767px) { div#page-section-5f5a8ef3230b5552772b0d6d .span-12>.row>.span-2 { width: 50% !important; float: left !important; } div#page-section-5f5a8ef3230b5552772b0d6d .span-12>.row>.span-3 { clear: left; } } Hi Tuan really hoping you can help me with almost the exact same thing! My site is https://www.nuligoods.com/ and I am trying to have columns in my footer as well. On desktop it looks just how I want it to: But on mobile it stacks it like this: I'm trying to make it like this, with my four sections of text in two columns: I so appreciate any help you can give I've tried so many things but I can't get it to work!!
Guest Posted January 11, 2021 Posted January 11, 2021 I have the same issue as above. On top of my footer I have two links ("prisliste" and "personvernerklæring"). They are correct in desktop view (side-by-side) but in the mobile view they appear stacked upon each other. I tried to get the above code to work on my site, but I wasn't able to do that. Help please 🙂 finn1pt.squarespace.com (password: access)
tuanphan Posted January 13, 2021 Posted January 13, 2021 On 1/2/2021 at 3:05 PM, Leah007 said: Hi Tuan really hoping you can help me with almost the exact same thing! My site is https://www.nuligoods.com/ and I am trying to have columns in my footer as well. On desktop it looks just how I want it to: But on mobile it stacks it like this: I'm trying to make it like this, with my four sections of text in two columns: I so appreciate any help you can give I've tried so many things but I can't get it to work!! Sorry, I don't see the notification You want, on mobile Logo Column 1. ..............Column 2 Contact .................Instagram FAQ...........................Pinterest Shipping................Text Returns Is this right? 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!)
tuanphan Posted January 13, 2021 Posted January 13, 2021 On 1/11/2021 at 2:21 PM, m_lundberg said: I have the same issue as above. On top of my footer I have two links ("prisliste" and "personvernerklæring"). They are correct in desktop view (side-by-side) but in the mobile view they appear stacked upon each other. I tried to get the above code to work on my site, but I wasn't able to do that. Help please 🙂 finn1pt.squarespace.com (password: access) Add to Home > Design > Custom CSS /* Footer text */ @media screen and (max-width:767px) { div#page-section-5f85c8730b2e96045323118d>.row:nth-child(2)>.span-6 { width: 50% !important; float: left !important; } div#page-section-5f85c8730b2e96045323118d>.row:nth-child(2)>.span-6 .html-block { padding: 0; } } 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!)
Guest Posted January 13, 2021 Posted January 13, 2021 4 hours ago, tuanphan said: Add to Home > Design > Custom CSS /* Footer text */ @media screen and (max-width:767px) { div#page-section-5f85c8730b2e96045323118d>.row:nth-child(2)>.span-6 { width: 50% !important; float: left !important; } div#page-section-5f85c8730b2e96045323118d>.row:nth-child(2)>.span-6 .html-block { padding: 0; } } Again, thank you very much tuanphan!
Guest Posted January 21, 2021 Posted January 21, 2021 On 9/30/2020 at 8:12 AM, tuanphan said: It seems you solved. Do you still need help on this? On 5/5/2020 at 5:05 AM, tuanphan said: h1 { font-family: monospace; } h2 { font-family: proxima-nova; } p { font-family: futura-pt; } Do similar for other elements On 1/12/2021 at 5:59 PM, tuanphan said: Sorry, I don't see the notification You want, on mobile Logo Column 1. ..............Column 2 Contact .................Instagram FAQ...........................Pinterest Shipping................Text Returns Is this right? Hi Tuan! Sorry now I didn't see the notification for a while. If you can still help me that would be amazing! My site url is https://www.nuligoods.com/ I currently have each pair of text (contact/FAQ, shipping/returns, etc) setup as seperate columns of texts and I love how it looks on desktop. I just can't figure out how how to set it up for mobile so two of the text blocks will fit side by side. I'd like it to look like: Instead of the current footer layout below: Thank you so much!!
donforello Posted February 4, 2021 Posted February 4, 2021 Hiya @tuanphan I would like to do something similar to the above, but I’m having trouble reworking the code. 1. I would like the “About” & “Support” sections to be side by side, not to stack. 2. For the -> button to be next to the email address field, not to stack. 3. For the three rows of content in the footer: (a) about/support, (b) newsletter, (c) logo to have less and equal spacing between them. Thanks so much! Site: https://greyhound-alpaca-f863.squarespace.com Password: alpaca
tuanphan Posted February 5, 2021 Posted February 5, 2021 On 1/22/2021 at 1:40 AM, Leah007 said: Hi Tuan! Sorry now I didn't see the notification for a while. If you can still help me that would be amazing! My site url is https://www.nuligoods.com/ I currently have each pair of text (contact/FAQ, shipping/returns, etc) setup as seperate columns of texts and I love how it looks on desktop. I just can't figure out how how to set it up for mobile so two of the text blocks will fit side by side. I'd like it to look like: Instead of the current footer layout below: Thank you so much!! Do you still need help? 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!)
tuanphan Posted February 5, 2021 Posted February 5, 2021 23 hours ago, donforello said: Hiya @tuanphan I would like to do something similar to the above, but I’m having trouble reworking the code. 1. I would like the “About” & “Support” sections to be side by side, not to stack. 2. For the -> button to be next to the email address field, not to stack. 3. For the three rows of content in the footer: (a) about/support, (b) newsletter, (c) logo to have less and equal spacing between them. Thanks so much! Site: https://greyhound-alpaca-f863.squarespace.com Password: alpaca Add to Design > Custom CSS /* footer mobile */ @media screen and (max-width:767px) { div#page-section-601974e7bc397811526a08e0 .span-12>.row .col:nth-child(n+2) { width: 50% !important; float: left !important; } .newsletter-form-body { display: flex; } } donforello 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!)
donforello Posted February 5, 2021 Posted February 5, 2021 Hiya @tuanphan, Thanks for getting back to me. The code you provided partially works (I've uploaded an image for your viewing), the top section is perfect, but the newsletter section is now reduced to 50%, I would like it to span the entirety of the row. Thanks again, your help is very much appreciated.
tuanphan Posted February 6, 2021 Posted February 6, 2021 14 hours ago, donforello said: Hiya @tuanphan, Thanks for getting back to me. The code you provided partially works (I've uploaded an image for your viewing), the top section is perfect, but the newsletter section is now reduced to 50%, I would like it to span the entirety of the row. Thanks again, your help is very much appreciated. I think this will require both CSS/JavaScript code. Do you use Personal or Business Plan? donforello 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!)
donforello Posted February 6, 2021 Posted February 6, 2021 Hiya @tuanphan, Thanks again for getting back to me. I use a Business Plan. Looking forward to hearing from you.
Guest Posted February 8, 2021 Posted February 8, 2021 On 2/5/2021 at 1:16 AM, tuanphan said: Do you still need help? Yes please!
Guest Posted February 12, 2021 Posted February 12, 2021 On 2/5/2021 at 1:16 AM, tuanphan said: Do you still need help? Just following up, I 100% need help, see my previous question. Thank you so much in advance!
Guest Posted February 12, 2021 Posted February 12, 2021 On 1/21/2021 at 10:40 AM, Leah007 said: Hi Tuan! Sorry now I didn't see the notification for a while. If you can still help me that would be amazing! My site url is https://www.nuligoods.com/ I currently have each pair of text (contact/FAQ, shipping/returns, etc) setup as seperate columns of texts and I love how it looks on desktop. I just can't figure out how how to set it up for mobile so two of the text blocks will fit side by side. I'd like it to look like: Instead of the current footer layout below: Thank you so much!! @tuanphan this is what I'm desperate for help on. Thanks so much in advance!
SimonJensen Posted June 4, 2021 Posted June 4, 2021 (edited) Hi @tuanphan! I've tried the code as well, and changed the "div#page-section" but didn't have any affect. I which to have the 'menu' & 'Følg os', side by side https://mayflower-quillfish-4hkh.squarespace.com/ Do you have any idea? Many thanks! Simon PS: If you now how to make the logo smaller in footer too, that would be highly appreciated. Thanks Edited June 4, 2021 by SimonJensen
tuanphan Posted June 4, 2021 Posted June 4, 2021 6 hours ago, SimonJensen said: Hi @tuanphan! I've tried the code as well, and changed the "div#page-section" but didn't have any affect. I which to have the 'menu' & 'Følg os', side by side https://mayflower-quillfish-4hkh.squarespace.com/ Do you have any idea? Many thanks! Simon PS: If you now how to make the logo smaller in footer too, that would be highly appreciated. Thanks Your site is private. Can you setup password & share url again? WE 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!)
SimonJensen Posted June 10, 2021 Posted June 10, 2021 Hi @tuanphan , Sorry, try this: https://mayflower-quillfish-4hkh.squarespace.com/ Pass: 12345
tuanphan Posted June 11, 2021 Posted June 11, 2021 21 hours ago, SimonJensen said: Hi @tuanphan , Sorry, try this: https://mayflower-quillfish-4hkh.squarespace.com/ Pass: 12345 Add to Design > Custom CSS /* Mobile footer */ @media screen and (max-width:767px) { div#page-section-60af817904e0b95f6204c39f .span-6 .span-3 { width: 40% !important; float: left !important; } div#page-section-60af817904e0b95f6204c39f .image-block { width: 50% !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!)
SimonJensen Posted June 23, 2021 Posted June 23, 2021 (edited) Amazing! THANK YOU! How does it work with multiple rows? And small logo too? See this: https://plum-chinchilla-yp7r.squarespace.com/ pass: 12345 Thanks Simon Edited June 23, 2021 by SimonJensen
tuanphan Posted June 24, 2021 Posted June 24, 2021 14 hours ago, SimonJensen said: Amazing! THANK YOU! How does it work with multiple rows? And small logo too? See this: https://plum-chinchilla-yp7r.squarespace.com/ pass: 12345 Thanks Simon Hi. Which rows/logo? 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!)
SimonJensen Posted June 25, 2021 Posted June 25, 2021 (edited) Hi @tuanphan, in footer.. The logo is massive and footer is really long. Can the logo be smaller? And can the 'sections' be set in row when there's mulitple and would need to stack? Edited June 25, 2021 by SimonJensen
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment