Page is a not externally linkable
- WebmasterWorld
-- New To Web Development
---- Need help! How to fix equal column height problem in DW-CS3 Template


PSWorx - 2:10 pm on Jul 8, 2009 (gmt 0)


Well depending on the code and design layout it could just be a case or wrapping your columns in a <div></div> with an id="styleName" attribute pointing to a piece of CSS (either embedded with <style></style> tags or via an external my.css file) which tells it to repeat a background image the height of the div which would be governed by the tallest of your columns (providing no floating/absolute objects interfere):

#styleName{
width: 700px;
background-image:url('columnBg.gif');
background-repeat: repeat-y;
background-position: top left;
}
.sidePanel {
width: 100px;
}

<div id="styleName">
<table cellspacing="0" cellpadding="0" border="0">
<tr>
<td class="sidePanel">100px</td>
<td>500px</td>
<td class="sidePanel">100px</td>
</tr>
</table>
</div>

That would work if say you have a solid colour background on the left and right and another sold colour in the middle of a three column layout, the image would only need to be 1px tall and as wide as the combined columns it would be applicable to i.e. 780px, take note of any padding that might be used in tables or elsewhere as this might cause confusion when setting widths/heights in CSS, refer to the CSS box model for info.

[w3.org...]

A snippet of the code relating to the area of the site in question would be best to provide a more specific answer.


Thread source:: http://www.webmasterworld.com/new_web_development/3947946.htm
Brought to you by WebmasterWorld: http://www.webmasterworld.com