Hi,
I’m having an issue with how text is being displayed on the homepage when viewed through a mobile device.
The text displays as intended on the desktop view, however when viewed on a mobile the text is offset to the right of the screen and misses a chunk of the text off.
We’re using the Brooklyn template and the element that is causing the issue is a slideshow.
Any help is greatly appreciated.
Best
Bob
Please share the store URL.
Thanks Osc!
@media only screen and (max-width: 600px) {
h2.hero__title.h1 {
font-size: 30px;
}
}
Add this css at the bottom of Online Store->Theme->Edit code->Assets->theme.scss.liquid
@media only screen and (max-width: 600px) {
.hero__slide .hero__title, .hero--adapt .hero__title {
font-size: 2.571em;
}
}
please add this code for theme.scss.css file under media query
@media only screen and (max-width:480px)
@oscprofessional Worked a treat - thanks so much!
@oscprofessional I changed the code in the first reply but I’m unsure where to put the 2nd code.
.hero__slide .hero__title, .hero–adapt .hero__title {
font-size: 2.571em;
}
@media only screen and (max-width: 600px) {
.hero__slide .hero__title, .hero--adapt .hero__title {
font-size: 2.571em;
}
}
@edwardandirwyn
Hii,
@oscprofessional apologies, I added your first solution -
Which appears to work but only spotted your second solution after replying and saying it was working.
Everything appears to be working but I haven’t added the second solution as I’m unsure where it is to be placed.
Thanka again.
Okay please ignore 2nd solution.
Will do - thanks again!
