newbie question

[aliis1214]

Hello All,

I have a site that I am working on:

http://www.gonegreenexpeditions.com

and I have one div #leftbar and another div #mainContent, what I want to do is make make sure that the #leftBar div will be the same height as the #mainContent. So far the #leftBar only has a #which is the #menuBar.

I had to make the width of the #leftBar at 800px height for the time being, but I want to have both of them at the same height without changing the CSS for every page.

One of the example pages is:

http://www.gonegreenexpeditions.com/courseinstruction.htm

I have the site also as a template if that may help with answering the question.

here is the CSS code for both divs:

Code:

#leftBar { width: 200px; float: left; clear: left; height: 800px; visibility: visible; background: #1A2602; }

Code:

#mainContent { height: auto; width: 595px; float: right; clear: right; font-family: Arial, Helvetica, sans-serif; font-size: 0.9em; font-weight: normal; color: #FFF; padding-left: 5px; }

I am still new to CSS and would love any suggestions that you can offer!

Thank you!

[virtual]

Read this article http://www.alistapart.com/articles/fauxcolumns/

[aliis1214]

I tried what was on the artical, but would it be easier to put the repeating background into the #wrapper div?

[virtual]

You just have to put your 2 columns within a div on which the background repeats y, that can be any one you wish. That way the design will repeat down on the containing div no matter which column is the longest. Do you understand ;)

[aliis1214]

I will give that a shot, Thank you Virtual! :D

[Author]

Posts