Row Horizontal Images in Mobile View

Site URL: https://potato-sphere-g3k8.squarespace.com/config/design

Hi! I have a row of horizontal images on my home page that are displaying HUGE and vertically on the mobile view. How do I keep these images small and horizontal in mobile view? Thanks so much!!

What is access password?

Website: naoow.com or https://potato-sphere-g3k8.squarespace.com/config/settings/domains

Password: naonow

Thank you!

13 hours ago, rachelt said:

Website: naoow.com or https://potato-sphere-g3k8.squarespace.com/config/settings/domains

Password: naonow

Thank you!

Add to Home > Design > Custom CSS

@media screen and (max-width:767px) {
div#page-section-5eae050ded72103d3af701d9>.row>.col {
    width: 50% !important;
    float: left !important;
}
}

You are awesome! Thank you!!! Now our font looks weird in mobile view-- is there a way to change the size of the font in mobile only? And is there a way to add an underline to the font when your mouse hovers over so that the viewer knows it is linked? Kind of like the images at the top of this page: https://www.cambly.com/kids/ 

@ tuanphan

Thank you!!

On 5/5/2020 at 9:08 AM, rachelt said:

You are awesome! Thank you!!! Now our font looks weird in mobile view-- is there a way to change the size of the font in mobile only? And is there a way to add an underline to the font when your mouse hovers over so that the viewer knows it is linked? Kind of like the images at the top of this page: https://www.cambly.com/kids/ 

@ tuanphan

 

Thank you!!

You mean change text font name in mobile only?

Yes! We just want to change it in mobile — the text under those images! 

12 minutes ago, rachelt said:

Yes! We just want to change it in mobile — the text under those images! 

Add to Home > Design > Custom CSS

@media screen and (max-width:767px) {
div#page-section-5eae050ded72103d3af701d9 p {
    font-size: 20px;
	font-family: monospace !important;
}
}

Thanks! It worked!!!