@tirnaJul 16.2010 — #maybe use this as a guide as long as the content of the centre column requires more height than the content of left and right columns. If it does then the left and right columns will appear to be the same height as the centre column
[code=php]
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <title></title> <style type="text/css"> <!--
@mgilveyauthorJul 18.2010 — #I think that will do it! Looks like the "overflow: hidden" is key. I need to understand what overflow does a bit more. Thanks for your help.
@mgilveyauthorJul 18.2010 — #maybe use this as a guide as long as the content of the centre column requires more height than the content of left and right columns. If it does then the left and right columns will appear to be the same height as the centre column[/QUOTE]
Hmm, I thought it was working but what I'm actually seeing is the "container" being extended down to the length of the center column. What I'm looking for is to get the left/right columns to extend to the bottom of the center column. I tried removing the overflow from the "container" and just putting it on the left/right columns but no luck.
The reason I want to do this is because I'm going to place a tiny graphic in the background of the left/right columns that will tile on the x axis so I want it to automatically be the same lenght as the center column. I suppose I could put one long graphic in the background of the "container" but I think I should know how to do it this way as well.
//--> </script> </head> <body> <div id="container"> <div id="left"> left column </div> <div id="center"> This is <br /> centre column<br />More Text<br />Some more text<br />Some more text </div> <div id="right"> right column </div>
Is that correct, a fat-finger thing or a forum posting problem? Shouldn't it be:
width: 70%;
2. For the "width" in the div IDs below that one, you have it: width: 33%}
Shouldn't there be a ; in front of that closing bracket?
3. I know very little about javascript so can you explain what it says? I think it is saying: in the document element id of left, for the height style, take the height style from the document element id called center.
And likewise for the right side, is that remotely correct?
@tirnaJul 18.2010 — #In the css there is a percent character in my code on my my pc after the 70 but for some reason when I copy and paste it from my pc's editor into my post, the web page "chooses" to convert it to what I assume is the html special character code. I have no idea why this web page is doing that ?
You don't normally need a semi-colon after the last style specification for a selector. The semi-colon is the designated separator between a list of styles. The w3c css validator will tell you if it is still valid to have a semi-colon after the last style. I can't remember off the top of my head if it is or isn't.
[COLOR=blue]document.getElementById('center').clientHeight[/COLOR] is the rendered height in the browser of the element with id = 'center'. The rendered height will depend on the amount of content in 'center'.
[FONT=Courier New][COLOR=black]is assigning the rendered height of the 'center' element to the the height style of the element named 'left'.[/COLOR][/FONT]