[CSS] Layout problems.

[Templarian]

So, I figured i'd work on my CSS skills a little bit.

http://www.templarian.com/cms/demo/indexcss.php

And am having problem getting the page to either go to the bottom 100% and getting the left and right sides from going too far.

(the black lines are just for showing the layout).

(what i hope it will soon look like, its just the defualt skin).
http://www.templarian.com/cms/demo/

[Jeff Wheeler]

Set the repeating background to the background of the body. That's the easiest way.

[hkl]

i have a similar problem only. I have 2 columns. column left is the navigation and a login. they are wrapped in a left float named leftColumn. The right column is content and there is a footer at the botton which is cleared.

the left column has a background color and if there is lots of content the left column doesnt follow it down. there is white space under the left column.

anyway way to fix this?

[Templarian]

Set the repeating background to the background of the body. That's the easiest way.

It has to be able to expand (the defualt skin works for all different widths sets).

[Jeff Wheeler]

i have a similar problem only. I have 2 columns. column left is the navigation and a login. they are wrapped in a left float named leftColumn. The right column is content and there is a footer at the botton which is cleared.

the left column has a background color and if there is lots of content the left column doesnt follow it down. there is white space under the left column.

anyway way to fix this?

You should use faux columns.

As for Templarian, you should use something like sliding faux columns.

[richter]

Yep, or see that post I just replied to here: http://www.kirupa.com/forum/showthread.php?t=214085

[Ankou]

Yep, or see that post I just replied to here: http://www.kirupa.com/forum/showthread.php?t=214085

The only problem with the solution you presented in that thread is if you're not sure which column is going to be the shortest one. Like with the example in your post for the thread linked in your post... if the containing div has a red background and the content area uses a white background, well all is fine IF the content area is longer than the other column. If the other column is longer than content area, the area remaining under the content area will have red showing.

With the faux column trick you don't need to worry about that because the background image will repeat to the bottom of the container.

BTW - so I'm not just talking about a different thread/post... I'm agreeing with nokrev on this one. Basicially it's what I was coming to suggest.

[.soulty]

I have been using the faux method for a while now and it works a treat, i actually never seen this article before now and had developed the method from some personal trial and error, what i found interesting thought was he mention if you use padding and/or margins you require the ie box hack? but alternatively you can use margins to prevent it. I actually havent used the hack and used padding most of the time and it still worked fine in ie for me.

What would be the issues that are suppose to happen in ie if you use padding and don't use the ie box hack?

[hkl]

i tried using an image same colour and tiling it on the y axis, it didnt work. maybe i was doing something wrong. thats why i posted here.