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>
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 [:)] )
TGirgenti
Member
129 Points
165 Posts
Three-column-container bg-three-column-home.png stopped repeating
May 11, 2009 08:39 PM|LINK
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>
rtpHarry
All-Star
56620 Points
8958 Posts
Re: Three-column-container bg-three-column-home.png stopped repeating
May 12, 2009 05:35 PM|LINK
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 [:)] )
TGirgenti
Member
129 Points
165 Posts
Re: Three-column-container bg-three-column-home.png stopped repeating
May 12, 2009 06:03 PM|LINK
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
Hyacinth Bro...
Member
64 Points
42 Posts
Re: Three-column-container bg-three-column-home.png stopped repeating
Oct 13, 2009 10:41 AM|LINK
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,
rtpHarry
All-Star
56620 Points
8958 Posts
Re: Three-column-container bg-three-column-home.png stopped repeating
Oct 13, 2009 11:00 AM|LINK
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....