1. duyvh0309
  2. Commercial Templates
  3. Thursday, 09 July 2020
  4.  Subscribe via email
Hi!

Could you advise me about css code to use for making responsive the header images?
I mean, I need mobile users could see the entire header images, not only a part of them.

Best Regards.
Gaetano
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Gaetano

Would you have a URL to an example of your header image?

Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 1
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Ciaran,
I've also this problem with commercial template J51_Boutique on pages where the template assigned has the param "Header Full screen" set as ON.
You can check this on home page https://www.lattoneriaveneta.com/ .

Thanks in advance for your help.
  1. more than a month ago
  2. Commercial Templates
  3. # 2
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Ciaran,

I've also this issue in my J51_Boutique template.
If the template has the parameter Header Full Screen set on YES the image is not resized on mobile in portrait mode.
References
  1. https://www.lattoneriaveneta.com/
  1. more than a month ago
  2. Commercial Templates
  3. # 3
Accepted Answer Pending Moderation
0
Votes
Undo
Thank you

To amend try adding the following to the Custom CSS field of your templates parameters (Extensions -> Templates -> [YourTemplateStyle] -> Custom CSS)....

@media only screen and (max-width: 1140px) {
#header_bg, #header_slide {
height: auto !important;
padding-bottom: 50%;
}}
@media only screen and (max-width: 986px) {
#header_slide {
padding-bottom: 60%
}}
@media only screen and (max-width: 767px) {
#header_slide {
padding-bottom: 70%
}}


Ciaran
  1. more than a month ago
  2. Commercial Templates
  3. # 4
  • Page :
  • 1


There are no replies made for this post yet.
Be one of the first to reply to this post!