fbpx

Missed the Birthday Party? Still You Can Enjoy the PartyView Deal

Welcome, Guest
Username: Password: Remember me

TOPIC: responsive background img

responsive background img 3 weeks 2 days ago #23374

  • Messina
  • Messina's Avatar
  • Offline
  • New Member
  • Posts: 14
  • Karma: 0
Hi everyone,
I searched the forum, but was unable to find a suitable solution.
I need to insert a background image to a section, but I need the image to be responsive; therefore I wolud to see (approximately) the image whole even on mobile devices.
I guess it resolves by properly configuring the section from
Section Settings > Design > Background
I have done some tests, but I can't find the correct configuration for to obtain my background image to be responsive.
Can you tell me how I should configure, or if I should also act on other parts of JD Builder?

Thankyou in advance
The administrator has disabled public write access.

responsive background img 3 weeks 2 days ago #23375

  • Messina
  • Messina's Avatar
  • Offline
  • New Member
  • Posts: 14
  • Karma: 0
(to give some more information)

so far, the solution most similar to the "correct" responsive that I managed to find, I reach it like this:
in Section Settings > Design > Background, I define

background repeat: no repeat;
background size: custom;
background width: 100%

The image would be responsive but (depending on the settings that I assign in Section Settings > Layout > Section Height), at the various resolutions (desktop, tablet, smartphone) a white space is displayed above and below the background image, or the image is only partially displayed (cut above and below).

The goal would clearly be to get the full, responsive image without white spaces.
How should I correct the settings?

Thanks
Last Edit: 3 weeks 2 days ago by Messina.
The administrator has disabled public write access.

responsive background img 3 weeks 2 days ago #23378

  • nishtha
  • nishtha's Avatar
  • Offline
  • Moderator
  • Posts: 1014
  • Thank you received: 102
  • Karma: 12
Hi,

Well you are doing things correctly, if you set a background image at any level then it is automatically responsive. To remove the white spaces, change the Background Size to Cover & the Background Position to Center Center, with this you wont see any spacing.
Then you can also adjust the section's height as per different screen resolutions.

Thanks,
Nishtha
Thank You,
If you like our support and products, tweet us at joomdev and let the world know about it.

To know more about products check out the their documentation.
The administrator has disabled public write access.
Moderators: chandandeep
Time to create page: 0.310 seconds