Ticket for: Accordions
0
Anonymous
Hi, How can I make the header background responsive on mobile? I have an image as my header background but it is not responsive to mobile.
0 Subscribers
Submit Answer
2 Answers
Best Answer
0
Hi, You can write custom CSS. When you're editing an accordion there is an option to write Custom scripts. just add the following CSS code.
Custom Script options: https://i.imgur.com/FRVUI4X.png
CSS Code:
#accordions-11243 #header-1646938886393{
background-size: 100% 100% !important;
}
Output: https://i.imgur.com/LtQ2Ntv.png
replace the old CSS code with this one to apply all accordions.
CSS:
#accordions-11243 .accordions-head{
background-size: 100% 100% !important;
}
for a very small screen I would suggest you to use a different picture. You can easily set different picture based on screen size by CSS.
Also how to apply this to all of the headers on the page?
Replying as
Submit
Best Answer
0
Could you please share the website URL so that we can check it online?
Replying as
Submit
For the mobile phone resolution.. what is the recommended size? It should appear clearly on both mobile and desktop.