Module styling CSS problem - siteground-j15-78

[scottymcc]

Newish to working with CSS. I have tried styling a module and even though I managed to center the images the background has vanished.

The CSS rule in the style sheet is


[code].EAImprovedModules {
margin-left: auto;
margin-right: auto;
background-color: #434hjfd
}[/code]


The Module Class Suffix is ".EAImprovedModules"

This is what I get on the site -




This is similar to what I had before with a different module.



How can I retain the background image/colour?

[Niko]

Hello Scottymcc,

The issue, which you are experiencing is most likely caused by the fact that there is a style with higher priority than your custom one, which overrides the background color of your module.

I tested the template in question and created a test module containing a centered image. As you can see from the following screen-shot, the background color gets preserved:

http://screencast.com/t/oOC2hmRZc9R

What I did for centering the image was to use the built-in alignment feature of the Joomla's WYSIWYG editor. As for styling the module I have used the default CSS defined in the templates/sitegroundj15-78/css/template.css file.

[scottymcc]

Thank you!

(This message seems too short).

[scottymcc]

This may seem like a silly question but as I have not had access to this computer for a while now and lost all work I have done + don't remember much of what I was doinging I find myself in the same place for this same problem.

I can not seem to find an area in the back end where I can apply image placement codes to any image within a module and I'm not sure exactly which lines are the default ones for this particular module.

[Niko]

Hello Scottymcc,

Could you please elaborate on the "image placement codes", because I did not manage to fully understand that part from your last reply.

[scottymcc]

Hi. My problem were with -

"What I did for centering the image was to use the built-in alignment feature of the Joomla's WYSIWYG editor. As for styling the module I have used the default CSS defined in the templates/sitegroundj15-78/css/template.css file."

I'm just not sure which part of the CMS I need to go to so as to change the alignment using the WYSIWYG editor. Can't see any way of doing this in the module specs under extentions.

I'll have a check again at trying to find the specific CSS which needs changed to alter the way the image displays.

[Niko]

Hello Scottymcc,

You can alter the positioning of your images by logging into the back-end of your Joomla, then clicking on "Extensions -> Module Manager", selecting your custom HTML module containing the image files (or create it anew if you have removed/lost it) and when you finally open the module for editing, scroll down to the bottom of the page where the "Custom Output" section is located. Click on the image within that section and center its position using the "Align center" button of the WYSIWYG editor.

[scottymcc]

Ok, I see where you are now. The problem is that the module is not one I made myself. They all came with a component and have certain features like presenting random images or tying up with the original component in some way.

[scottymcc]

Which specific rule would I be changing in the CSS to center align the images?

[Niko]

Hello Scottymcc,

In this case if the module in question contains no options for centering the content included in it, the best course of action would be to contact the developers of that component and request further assistance for adjusting the module according to your own specific requirements.