Shape 5

Joomla Templates => Business Look - November 07 - Club => : Chris Deguara September 17, 2009, 01:41:43 AM



: Setting the main content area height to 100%
: Chris Deguara September 17, 2009, 01:41:43 AM
Hi,

I am using the businesslook template. I edited it a lot. I want that the main content area stretches to the whole height of the screen.

Follow this link to view the website.

http://
maths
malta
.
cyber
pass
web
studios
.
com

Just append the link by adding it in one line (I did this so Google won't index it since this is a development website)

All I want is that the main content area (the white background) is  stretched to 100% height and the fotter is obviously displayed at the end of the page.

Please this is pretty urgent...

Many thanks in advance

Regards


: Re: Setting the main content area height to 100%
: jonahh September 17, 2009, 01:41:16 PM
To do this add the height of 100% to the follow DIV areas

template_css.css (line 785)

#s5_background {
height:100%;
width:100%;
}

template_css.css (line 776)

#s5_wrapper {
height:100%;
margin:0 auto;
width:980px;
}

template_css.css (line 504)

#s5_mainback {
clear:both;
height:100%;
width:100%;
}


As for the footer I'm not sure.



: Re: Setting the main content area height to 100%
: Chris Deguara September 28, 2009, 06:43:18 AM
Hi Jonahh,

thanks for the reply.

Unfortunately, this did not work. I tried to add the height 100% in several divs (You must supposedly set the body height to 100% and then set a div found inside the body to 100%) This should work, however it didn't. Any more help would be greatly appreciated.

Also, I encountered another problem. If you enter the website, you should notice that I drastically changed the design (to match the design of the client). It works the same on every browser. However, when i load it with IE6, it is a total disaster! Can you please help me a bit on how to fix it on IE6? :S

I would greatly appreciate that.

Will be waiting for your reply.

thanks and regards,
Chris Deguara


: Re: Setting the main content area height to 100%
: jonahh September 30, 2009, 11:02:53 AM
Hello Chris,

For the screen height it most likely needs a pixel not a percentage this is probably why it didn't work.  If add something like the below to the bottom of your index.php file I think this should work:

<script language="javascript">
<!--
document.getElementById("s5_mainbody").style.height = screen.height + "px";
//-->
</script>

As for the IE6 problem, check near the top of the index.php file and look for CSS.  This is just for IE6 only and due to transparency issues we had to put it in the index.php file.  You'll have to also make the same edits you made to the template_css.css file here too.

Regards,