2 Replies Latest reply on Aug 21, 2012 2:42 PM by hofgad_lady

    Create a third column.

    hofgad_lady

      What is the proper way to create a third column for this website. The div shouldn't float right because it covers up the other content div when the screen is resized. I have tried setting a wide margin but the margin causes the left sidebar and content div to drop down too low on the page. I am working on a template for the entire site pages.

       

      Thank you for your help!

       

      Website: www.gaddislaw.com

        • 1. Re: Create a third column.
          osgood_ Level 8

          In the page that you want to add a  3rd column you would need to amend the .content css to as below: (I've commented out /*   */ the css that is not required) .

           

           

          content {

          float: left;

          width: 530px;

          padding-top: 25px;

          padding-right: 0;

          padding-bottom: 10px;

          margin-top: 0px;

          /*margin-right: 40px;*/

          margin-bottom: 0px;

          /*margin-left: 290px;*/

          padding-left: 20px;

           

           

          Then add the css for the 3rd column: 

           

          .thirdCol {

          float: left;

          width: 250px;

          }   

           

          Then add the 3rd column into the html in the position shown below:

          <p class="footer_type">

              <!-- end .content -->

            </p>

          </div>

           

          <div class="thirdCol">Third Column</div>

           

           

          <script type="text/javascript">

            </script>

          <div class="footer">

           

          1 person found this helpful
          • 2. Re: Create a third column.
            hofgad_lady Level 1

            Worked very well. Just had to change the position of the 3rd column in the html because it was falling below the footer.

             

            Thanks!

             

            Judy