Hi

 

 

I created a website for an executive/personal coach a few months back,

 

 

Marly Coaching

 

 

all was good until he required changes to be made.

 

 

Now I cannot get the layout to work correctly,

 

The footer and side banners are not resizing/moving as they should

 

 

This must be resolved by the 7th so doesn't give me much time, any help would be much appreciated...

 

 

It is a joomla site unfortunately, but please take a look at the code, I can send the template to anyone who's willing to take a look

 

 

 

 

 

HELP- I'm completely exhausted of ideas and cannot seem to resolve it myself

 

 

 

 

DWP

The Footer itself is working correctly now

 

 

I just need help with getting the 'background' to repeat down the page taking into account the different page lengths.

 

 

this sounds so simple, yet I cant get it to work

Hi,

 

Your situation sounds very familiar - we all end up under this sort of pressure.

 

I've never used Joomlah but have used Wordpress and Dot Net Nuke (although I wouldn't touch the latter with a barge pole again!).

 

I guess when you use an open source software like Joomlah and the rest you're restricted by the template you choose, unless you've learned how to create your own templates.

 

I prefer to build from scratch with css and xhtml. It just gives you so much more freedom to create without the restrictions of working within a predefined framework.

 

Is it not possible to start again without Joomlah? I did a site for a client very similar to yours (a life coach) and seems to have very similar content. Check it out if you want for ideas:

 

www.qccgroup.com

 

Your client might be interested in the "Wheel of life" tool that I built for my client in flash.

 

Not perfect by any means but easier to manipulate and change.

 

Good luck!

 

Jo

Hi josoap

 

 

thanks for your reply

 

I did create the template myself, well using a software to convert a PSD, but have coded/changed the whole template myself to obtain what I required.

 

All that work and im stuck on the background haha

 

 

Wheel of life looks like a good function, il pass the link on to him

 

 

 

Anyone know how i fix this background

No problem. Wish I could help more.

 

I wasn't trying to use your predicament as an opportunity to promote something I've done but if it helps keep your client happy, sure, pass on my details (I guess via this forum for now)if they'd like a copy of the interactive wheel.

 

Cheers,

 

Jo

Update

 

 

The background(s) are using the 'non footer' height settings as they should,

 

but are not filling to the page size, and only seem to be using the 'min-height' size of 1307px.

 

 

 

could anyone tell me the code that I have missing that would allow the non footer/backgrounds to follow the footer and extend past 1307px filling the page (white space).

 

 

 

 

#nonFooter
{
		position: relative;
		min-height: 1307px;

		height:auto !important; /* real browsers */
		height:100%; /* IE6: treaded as min-height*/



}

* html #nonFooter
{
		height: auto;
		min-height:auto;



}

 

 

 

Hope you can makes sense of what I mean

 

Thanks

 

DWP

I tried looking through your css files but that was kind of painfull. Can you paste the css that has the background in it so we can look at it?

 

If it's as simple as it looks all you have to do is define the background for the html element in your css file...

but the structure of your site is quite different from how I code so I could be wrong.

#greyleft-side {
 			position: absolute;
 			margin:0 auto; /* center, not in IE5 */	
 			height:auto; !important; /* real browsers */
 			height:100%; /* IE6: treaded as min-height*/
 			min-height:100%; /* real browsers 	overflow: auto;*/
			left: +0px;
 			top: 0px;
 			width: +160px;
 			height: +0px;
 			z-index: 4;
 			padding: 3px 0px;
 			background-color:#d2d2d2;
 			text-align: left;    		






}

 

 

 

#greyright-side {
 			position: absolute;
 			margin:0 auto; /* center, not in IE5 */	
 			height:auto; !important; /* real browsers */
 			height:100%; /* IE6: treaded as min-height*/
 			min-height:100%; /* real browsers 	overflow:auto;*/
 			left: +1180px;
 			top: 0px;
 			width: +83px;
 			height: +10px;
 			z-index: 4;
 			padding: 3px 0px;
 			background-color:#d2d2d2;
 			text-align: left;    			
}

 

hope this helps

 

Thanks for your input

 

 

DWP

I may not be understanding something you're trying to do here but shouldnt you just be able to type something like:

 

html {

background-color:#d2d2d2;

}

 

and then all the extra white space would be filled?

I may not be understanding something you're trying to do here but shouldnt you just be able to type something like:

 

html {

background-color:#d2d2d2;

}

 

and then all the extra white space would be filled?

 

 

I apologise Griffin, my computer crashed while I was retrieving all the code.

 

right {
 			position: absolute;
 			margin:0 auto; /* center, not in IE5 */	
 			height:auto; !important; /* real browsers */
 			height:100%; /* IE6: treaded as min-height*/
 			min-height:100%; /* real browsers 	overflow:auto;*/
 			left: +1180px;
 			top: 0px;
 			width: +14px;
 			height: +10px;
 			z-index: 4;
 			padding: 3px 0px;
 			background-color:#ffffff;
 			background-image: url(../images/gradient_rightbg.gif);
		background-repeat: repeat-y ;
 			text-align: left;    			
}

 

left {
 			position: absolute;
 			margin:0 auto; /* center, not in IE5 */	
 			height:auto; !important; /* real browsers */
 			height:100%; /* IE6: treaded as min-height*/
 			min-height:100%; /* real browsers 	overflow:auto;*/
 			left: +160px;
 			top: 0px;
 			width: +14px;
 			height: +20px;
 			z-index: 4;
 			padding: 3px 0px;
		background-color:#ffffff;
 			background-image: url(../images/gradient_bg.gif);
		background-repeat: repeat-y ;
 			text-align: left;    			
}

 

 

The latest code is for the fade effect that can be seen on the left and right of the background, and is why i cannot use your proposed coding

 

 

Thanks for your help again much appreciated

 

hope the above helps you

 

 

DWP

Ah ok, yeah you seem to have taken a bit more complicated path than I would have. What you could do is get rid of those side things all together, then in your psd take a 1px high slice of the website that includes the gray gradients on the side, adjust the main content container's width to match the width of this slice, then set the background of that container to the image you just made and have it expand downward...then as content is filled it's forced to expand down with it.

Ah ok, yeah you seem to have taken a bit more complicated path than I would have. What you could do is get rid of those side things all together, then in your psd take a 1px high slice of the website that includes the gray gradients on the side, adjust the main content container's width to match the width of this slice, then set the background of that container to the image you just made and have it expand downward...then as content is filled it's forced to expand down with it.

 

 

 

A I see what you mean, I shall try it tomorrow, I have created the slice, but will code tomorrow and let you know how I get on, its getting on to 10pm here and im exhausted.

 

 

Joomla! seems to make everything much harder, well for me anyway

 

 

thanks again for your help griffin much appreciated

is there a way of getting them to move down as they are at the moment at all?

 

the way the website is created it would be very hard to do the above without getting into the predicament I'm in now, which is how to get it to move down with the content.

This may work try changing min height to 100.3% on the following divs

 

greyleft-side

yellow-left

greyright-side

yellow-right

 

tried in firefox and ie8 seemed to work

This may work try changing min height to 100.3% on the following divs

 

greyleft-side

yellow-left

greyright-side

yellow-right

 

tried in firefox and ie8 seemed to work

 

 

HI Mteam

 

 

Thanks for your input, yes that did work for the home page, thanks..........

 

 

but if you click on the 'Executive Coaching' link the page is longer and therefore has white space underneath the bg columns

 

 

 

thanks again for your input

 

keep the ideas coming

 

 

DWP

Sorry I only tried the home page

Sorry I only tried the home page

 

 

Thats fine mate all help is appreciated, and at least the home page looks better lol

 

cheers again

 

 

Any more Ideas?

 

 

DWP