Sidebar and Content (Posts and Pages) Length

Hi, Adam.

You need to place both the content area and the sidebar inside a container div with a border, and then you can give either of the columns a side border, as well, to maintain your design.

I hope that helps.

Jo

you can throw this script in your header file.

<script language="javascript">

matchHeight=function(){
  var divs,contDivs,maxHeight,divHeight,d;

  // set the class of the elements to match hieght
  var thisID = 'someID';

  // get all <div> elements in the document
  divs=document.getElementsByTagName('div');
  contDivs=[]; 

  // initialize maximum height value
  maxHeight=0; 

  // iterate over all <div> elements in the document
  for(var i=0;i<divs.length;i++){ 

       // make collection with <div> elements with class attribute assigned to 'thisID'
       if(thisID.test(divs[i].className)){ 

             d=divs[i]; 

             contDivs[contDivs.length]=d; 

             // determine height for <div> element
             if(d.offsetHeight){
                  divHeight=d.offsetHeight;
             } 

             else if(d.style.pixelHeight){
                  divHeight=d.style.pixelHeight;
             } 

             // calculate maximum height
             maxHeight=Math.max(maxHeight,divHeight); 

       } 

  } 

  // assign maximum height value to all of container <div> elements
  for(var i=0;i<contDivs.length;i++){
       contDivs[i].style.height=maxHeight; 

  } 

} 

// execute function when page loads
window.onload=function(){
  if(document.getElementsByTagName){
       matchHeight();
  }
} 

</script>

give all your wrapper div the same class (use ID tag for css stuff, and the class tag for the script to use)

Yikes…

viabledesign, I understand your method, but am a little unsure of how to do it. Would I write a container div into the index.php or page.php and then add a border to it in my styles.css?

Adam

Thanks jerardneal. How do you give divs classes? Sorry, I’m that new to this…

Can anyone help to walk me through either of these approaches a little (or someone else suggested the height:100%; tag, but I haven’t gotten that to work)? I’ll provide my code… This site is almost finished except for this issue.

I don’t know how to make a container div or include other divs in a container, nor do I know how to assign classes to divs.

This is probably so simple, but I’m a little lost…

Adam,

I replied to you in the wrong thread, I believe. Sorry. I’d like to help, though, and ran across another option, using borders: https://www.alistapart.com/articles/multicolumnlayouts

I think that would work well in this case. Contact me through my site (listed on my profile), and I’ll see what else I can do to help you get that beta working.

Jo

Position Is Everything has an article on how to do this with source-ordered containers. My blog works on this principle. You can find their article here:

https://www.positioniseverything.net/articles/sidepages/jello-piefecta-clean.html