How to customize Joomla JA MOOD background for mobile?

rborst

Hi,
How to customize Joomla JA MOOD full size background for mobile?

aman204

rborst Try add this to custom.css file :

@media only screen and (min-device-width: 320px) and (max-device-width: 480px){.layout-home .t3-masthead .t3-masthead-mask{background-image: url(/images/joomlart/background/bg-responsive.jpg) !important;}}

and upload your background image and change backgound url path accordingly with certain width and height for appropriate responsive screen size

rborst

Thank you for your reply. Unfortunately, it didn't work out.. Did I something wrong?
/domains/rodneymitchel.nl/public_html/templates/ja_mood/css/Custom.css

@media only screen and (min-device-width: 375px) and (max-device-width: 667px){.layout-home .t3-masthead .t3-masthead-mask{background-image: url(/images/joomlart/background/bg-responsive.jpg) !important;}}

aman204

rborst Hi

Can you add your admin details in edit fields in order for us to take closer look

For reference, You can follow thread post (5 point) procedure.

rborst

aman204
Thank you for the quick reply
I have add the admin details and FTP details 😃

aman204

rborst Upon reviewing closely, The media query css I have suggested is being applied however, You would require to make changes for screen size value with changing px value in min-device-width: 375px and max-device-width: 667px accordingly to get it right for certain breakpoints

You may kindly refer to forum post here which elaborates on making changes for certain breakpoints as per responsive sizes

Also, This tutorial can help in getting the comprehensive list of media queries for varied devices