A very interesting fact about joomla is that you can’t have separate module styles all the time. You need to work your way with module class suffix. Well, how do you have the right sidebar modules with rounded corners whyle the left sidebar menu has a different style?

The answer is simple, with a little help of javascript. And here si how you can get it done.

First step is to include the code

Open up your template`s index.php file and paste this code before the end of the head tag.

After that include this js inside your template folder. (Right click -> “Save As”). Then navigate to your module and set up a suffix in the module like in the picture below.

Next step is to change within the pasted code we inserted earlyer the new class name of the module. If the module class suffix is “_john” within the code we replace it like this:

And presto, you have instant rounded corners even in IE. NOTE that for a menu module the prefix for the menu class is “module“. So the code will be like “module_menuname“.

Other rounded corners resources for Joomla:

• Creating rounded corners in Joomla Modules
• CSS: border-radius and -moz-border-radius
• Joomla Class Suffix guide

The credits for the Javascript code go to CurvyCorners.