Changing banner size for mobile use

Site URL: https://www.roydenniessigns.com/

Hi I am currently creating a website for my workplace, I have almost finished the site but unfortunately I am having trouble with the website banners in tablet and mobile view.

I was hoping that someone would be able to help me with a custom code to make the banner fit in mobile and tablet, I would also like the banner images to be displayed in portrait.

Edit - I have added two images of how I would like the banners to appear in mobile view, if you can help me achieve this it would be much appreciated

Thank you in advance.

Hi. Add to Design > Custom CSS > Then save & reload your site

/* Mobile-Homepage-Resize banners */
@media screen and (max-width:640px) {
body.homepage .Parallax-item img {
    width: 100% !important;
    height: auto !important;
    left: 0 !important;
    top: 0 !important;
}
section#about-intro {
    min-height: unset !important;
    height: 200px;
}
/* top banner text */
section#about-intro * {
    font-size: 38px;
}
section#about-quote-mojave {
    min-height: unset !important;
    height: 200px;
}
/* bottom banner text */
section#about-quote-mojave * {
    font-size: 20px;
}
}

That's great thank you for your help

Would we be able to alter the code for it to appear like the images I have posted above please?

I have edited the original post and added two images to show how I would like the banners to be displayed, please let me know if you can help

Thank you in advance

On 7/8/2021 at 9:43 PM, Slawsonwill said:

That's great thank you for your help

Would we be able to alter the code for it to appear like the images I have posted above please?

I have edited the original post and added two images to show how I would like the banners to be displayed, please let me know if you can help

Thank you in advance

Hi. I don't see image in your post? Can you check it again?

Sorry for the confusion, the images didn't upload.

I have posted them in the this reply.

Thank you for your continued help.

22 hours ago, Slawsonwill said:

Sorry for the confusion, the images didn't upload.

I have posted them in the this reply.

Thank you for your continued help.

 

 

You mean move the position of the car in the pictures?

Yes I would like them to be displayed in portrait and zoomed in like the examples above please

Thank  you

Hi. Do you still need help?

Also, some other problems/

(Mobile – Services) Word break. In desktop/Tablet don’t have minus between letters.

https://www.roydenniessigns.com/services

4. (Mobile – Gallery)Word is cut off

https://www.roydenniessigns.com/work-gallery

Yes please, 

Is there a way to change the code to make the banner look like the images I have displayed above?

Thank you in advance

If you could also help with the 'services' and 'gallery' page title and subheading size that would be great

On 7/26/2021 at 1:44 PM, Slawsonwill said:

If you could also help with the 'services' and 'gallery' page title and subheading size that would be great

Your site is private. Can you setup password & share url again?

I have made the website public again the url is:

https://www.roydenniessigns.com/

On 7/27/2021 at 5:18 PM, Slawsonwill said:

I have made the website public again the url is:

https://www.roydenniessigns.com/

Try adding to Design > Custom CSS

@media screen and (max-width:640px) {
body.homepage .Parallax-item img {
    left: 0px !important;
}
}