Make module content fit background image not other way?

Everything to do with Joomla! 2.5 templates and templating.

Moderator: General Support Moderators

Forum rules
Forum Rules
Absolute Beginner's Guide to Joomla! <-- please read before posting, this means YOU.
Forum Post Assistant - If you are serious about wanting help, you will use this tool to help you post.
Locked
FFC123
Joomla! Fledgling
Joomla! Fledgling
Posts: 4
Joined: Tue Sep 17, 2013 1:54 pm

Make module content fit background image not other way?

Post by FFC123 » Sun Apr 19, 2015 12:30 pm

Hi all - Novice here, so please be gentle! :eek:

Without knowing how else to achieve what I'm trying to achieve, I have set a background image in a module and published it to the showcase position. Now I want to ensure that the following 2 things happen:

1. 100% of the height of the background image is always displayed

2. Module remains responsive (ie. 100% of the height of the background image will be displayed whatever screen size)

Any help would be very much appreciated - been fiddling with this for days now and it's driving me nuts grrrrrrr!

JoomIa-Shark
Joomla! Explorer
Joomla! Explorer
Posts: 306
Joined: Fri Apr 17, 2015 5:40 pm
Contact:

Re: Make module content fit background image not other way?

Post by JoomIa-Shark » Sun Apr 19, 2015 12:43 pm

I think you should be able to achieve this by putting this on the element:

{ background-size: cover}
Joomla Help and Resources: www.joomla-shark.com

FFC123
Joomla! Fledgling
Joomla! Fledgling
Posts: 4
Joined: Tue Sep 17, 2013 1:54 pm

Re: Make module content fit background image not other way?

Post by FFC123 » Sun Apr 19, 2015 12:47 pm

Thanks for the reply!

{ background-size: cover} doesn't work for me in this instance because the background image is deeper/heigher than the content of the module. So my background image is clipped off at the bottom.

I guess I could add padding to the content, but I don't know how to do that and ensure that the module will be responsive.

JoomIa-Shark
Joomla! Explorer
Joomla! Explorer
Posts: 306
Joined: Fri Apr 17, 2015 5:40 pm
Contact:

Re: Make module content fit background image not other way?

Post by JoomIa-Shark » Sun Apr 19, 2015 1:11 pm

Could you put the padding and width as a %?

That would keep it responsive.
Joomla Help and Resources: www.joomla-shark.com

FFC123
Joomla! Fledgling
Joomla! Fledgling
Posts: 4
Joined: Tue Sep 17, 2013 1:54 pm

Re: Make module content fit background image not other way?

Post by FFC123 » Sun Apr 19, 2015 1:14 pm

Yeah, but I think I'm going to get pretty unpredictable results unless I know that the full height of the background image is going to be displayed. If only this was the matrix I'd just plug myself in and learn CSS in 5 minutes!


Locked

Return to “Templates for Joomla! 2.5”