Three-column-container bg-three-column-home.png stopped repeating

Last post 10-13-2009 7:00 AM by rtpHarry. 4 replies.

Sort Posts:

  • Three-column-container bg-three-column-home.png stopped repeating

    05-11-2009, 4:39 PM
    • Member
      119 point Member
    • TGirgenti
    • Member since 03-01-2006, 10:32 PM
    • Posts 131

    Hello,

    After modifying the text in the following <p> from the default.aspx in the Small Business Starter kit,

    For some reason it does not repeat the bg-three-column-home.png file down the right side of the column.

    I did not change the css-content.css, i just changed the text that it applies to.

    Can anybody explain why the dashed horizontal separator line does not appear all the way down the right side of the column anymore?

    Any help would be gratefully appreciated.

    Thanks,
    Tony

    <div id="three-column-container">
        <div id="three-column-side1">
            <a href="Items.aspx">
            <img src="images/home-photo-1.jpg" class="photo-border" alt="Enter Alt Text Here" /></a>
            <h2>
             Our Services
            </h2>
        <p>
             We do not apply a service charge with a repair.
        </p>
            <a href="Items.aspx">read more</a><img class="arrow" src="images/arrow.gif" alt="" />
        </div>

     

  • Re: Three-column-container bg-three-column-home.png stopped repeating

    05-12-2009, 1:35 PM
    • All-Star
      36,178 point All-Star
    • rtpHarry
    • Member since 10-01-2006, 12:51 PM
    • Lincoln, England
    • Posts 5,818

     Hi,

    It is probably something to do with the height of a div.

    Does this new page have a short contents div in it?

    With CSS the height of the column is only as tall as the height of its contents. It is not specialised in vertical layout.

    You can use jQuery/Javascript to trick this into equal heights, or also use background tricks to simulate an equal height column.

     

    Either:

    Look at this plugin:

    OR

    Post more code so we can be of help in pin pointing. The whole page plus the css thats needed to view it, or a url where we can see this page working (or not working Smile )

  • Re: Three-column-container bg-three-column-home.png stopped repeating

    05-12-2009, 2:03 PM
    • Member
      119 point Member
    • TGirgenti
    • Member since 03-01-2006, 10:32 PM
    • Posts 131

    Hello rtpHarry,

    I'm not sure i understand all of your suggestions, but you can see what this looks like by going here: http://www.tonygirgenti.net.

    Thanks for any help you can provide.

    Tony

  • Re: Three-column-container bg-three-column-home.png stopped repeating

    10-13-2009, 6:41 AM

    Yep, Harry is right when he says it is likely to be something to do with the height of the divs.

    #content-side1-three-column {
    	float:left;
        top: 1px;
        left: 1px;
        height: 500px;
    }


    There above is one of the declarations for one of those divs, and it limits itself to 500 pixels.

    Now, in your example, the right hand column runs on down to longer than that.

    Suggest you play around with  the heights of the other column divs.

    Regards,

  • Re: Three-column-container bg-three-column-home.png stopped repeating

    10-13-2009, 7:00 AM
    • All-Star
      36,178 point All-Star
    • rtpHarry
    • Member since 10-01-2006, 12:51 PM
    • Lincoln, England
    • Posts 5,818

    TGirgenti:

    Hello rtpHarry,

    I'm not sure i understand all of your suggestions, but you can see what this looks like by going here: http://www.tonygirgenti.net.

    Thanks for any help you can provide.

    Tony


    Hey, happy to check it out but when I tried it kept timing out. Is this hosted on your home computer? Perhaps I picked a bad time to visit....


Page 1 of 1 (5 items)