change font size and spacing mobile view only

change font size and spacing mobile view only

mathieulenoir
Tourist
23 0 2

hi

I would like to fit my menu within one line on mobile mode. Currently desktop view is fine but mobile view looks like this: anyone could help me with css code? THANKS!

mathieulenoir_0-1703645428517.png

 

Replies 9 (9)

suyash1
Shopify Partner
10555 1304 1671

@mathieulenoir - will need to reduce font size, but then they can look squeezed, can you please share this page link?

Support me | To build shopify pages use PAGEFLY | Contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
mathieulenoir
Tourist
23 0 2

dear Suyash1

here is comes

https://labalisienne.com/

pw:#BEBEdragon23

 

suyash1
Shopify Partner
10555 1304 1671

@mathieulenoir - add this css to the very end of your base.css file and check

 

@media (max-width: 768px){
.list-no-bullet{padding-left: 5px !important;}
.list-no-bullet .li-item{margin-right: 11px !important;}
}
Support me | To build shopify pages use PAGEFLY | Contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
mathieulenoir
Tourist
23 0 2

thanks

the padding is better but font size is still the same...any solution to decrease font size of the text?

mathieulenoir_0-1703647147553.png

 

suyash1
Shopify Partner
10555 1304 1671

@mathieulenoir - replace old code with this one and check

 

 

@media (max-width: 768px){
.list-no-bullet{padding-left: 5px !important; font-size: 8px !important; text-align: center;}
.list-no-bullet .li-item{margin-right: 11px !important;}
}

 

Support me | To build shopify pages use PAGEFLY | Contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
mathieulenoir
Tourist
23 0 2

didnt work unfortunately 😞

mathieulenoir_0-1703647840294.png

 

suyash1
Shopify Partner
10555 1304 1671

@mathieulenoir - try this

@media (max-width: 768px){
.link-item{font-size: 10px !important;}
}
Support me | To build shopify pages use PAGEFLY | Contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.
mathieulenoir
Tourist
23 0 2

it is better but yet cant fit it within 1 line

mathieulenoir_0-1703648585069.png

i guess i will never manage to fit everything into 1 line.

i need to find another solution..

thanks for helping out though

suyash1
Shopify Partner
10555 1304 1671

@mathieulenoir - one line will squeeze the menu items

Support me | To build shopify pages use PAGEFLY | Contact me - suyash.patankar@gmail.com , My timezone is GMT+5:30.