For my present requirement, I need to increase the template width, which also mean that the width of the footer(the Joomla support boxes, and the footer itself) have to be increased.

a) increase template width: just one setting in Beez20 gets this done. The default width(max-width) is 1050px and is found in position.css, in the all-div starting from line#32. Below is my new width: copy and paste this code into override.css file.

#all
{
margin: 0 auto;
max-width:1280px;
padding: 0px;
text-align: left;
}

Note: I only modified max-width.

b) increase footer-boxes width: one of which is shown below:

The inner-boxes(contribute, books and shop) are contained in an “inner footer” div. Their original / combined width is 1025px(line#412-418 in position.css). Below is the new width with respect to the above-modified page-width. Copy and paste below code into override.css.

#footer-inner
{
max-width:1255px;
margin:0 auto;
font-size:0.8em;
padding:10px 15px 15px 10px;
}

Note: I only modified max-width. You might have to do some trial and error to make sure the footer width matches your own template width, if different from mine.

c) Increase footer width: the footer itself (visible if footer module is published) is the horizontal column containing copyright information and Powered by Joomla.

The original width of this area is 1020px(line#1406-1414 in layout.css). I modified it to 1250px considering the inner footer width.

Copy and paste this into override.css

#footer
{
padding:15px 10px 15px 20px;
text-align:right;
margin:0 auto;
display:block;
max-width:1250px;
overflow:hidden
}

Below is the screenshot of my template:

joomla-beez20-5

Your comments, questions and clarifications are welcome!

You have no rights to post comments