For some reason I’m having cell spacing issues with this carousel page. I realize that I need to remove the empty cells I’m using for decoration, but why are the Buried and Estates carousel panels spaced properly, but the rest are not?
http://www.williamsburgmemorialpark.com/properties/cremation.html#
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Okay, I removed all of the decorative spacing and have used a class style to add the rules, so the page is now XHTML 1.0 Strict compliant, but I’m still having cell height problems.
Any ideas on what is causing this?
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Carousel elements have to be a fixed dimension, that’s how the effect calculates the height or width of the internal “filmstrip” element and makes the animation move from one “frame” to the next. If you draw your tables as a nested child of a fixed-dimension HTML box (which will act as the base for each pane) you can then remove the height attribute from the table, which will cause the borders to snug up against the padding and content of the cells. What you’re seeing now is the fixed height of the table being evenly divided between the number of cells.
Walter
On Oct 2, 2012, at 9:44 AM, RavenManiac wrote:
Okay, I removed all of the decorative spacing and have used a class style to add the rules, so the page is now XHTML 1.0 Strict compliant, but I’m still having cell height problems.
Any ideas on what is causing this?
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
I thought that’s what I did.
Walter, I think I’ve located the problem. Check out this code:
<tr class="rule">
<td valign="top" style="width:115px; height:43px"><h1>Pricing</h1>
</td>
<td valign="top" style="width:115px"><p class="tableHeading">Westminster<br/>Gardens</p>
</td>
<td class="tableHeading" valign="top" style="width:115px"><p class="f-sp"> </p></td>
<td class="tableHeading" valign="top" style="width:115px"><p class="f-sp"> </p></td>
</tr>
<tr>
<td valign="middle" style="width:115px; height:24px"><p class="tableBodyLeft">Section:</p>
</td>
<td valign="middle" style="width:115px"><p class="tableBody">2</p>
</td>
<td valign="middle" style="width:115px"><p class="f-sp"> </p></td>
<td valign="middle" style="width:115px"><p class="f-sp"> </p></td>
</tr>
Note the non-breaking space. Every carousel that has a spacing problem has this in the cells. How do I get rid of this space?
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
The non-breaking space is there to fix a browser rendering foible – empty cells are (sometimes) not rendered at all, and their borders aren’t either. Note the f-sp class on that space, though – that renders the text as 1px tall, so I doubt it’s your problem. The table cells without any content do not have a height set, but those that do have content are set with a defined height (43px in the top row).
If you can’t get rid of the height by clicking on the up/down arrow icon left of the height field while the table is selected (handles showing at the corners), then try applying my RemoveDimensions Action to the table, and see if that fixes it.
Walter
On Oct 2, 2012, at 10:11 AM, RavenManiac wrote:
I thought that’s what I did.
Walter, I think I’ve located the problem. Check out this code:
<tr class="rule"> <td valign="top" style="width:115px; height:43px"><h1>Pricing</h1> </td> <td valign="top" style="width:115px"><p class="tableHeading">Westminster<br/>Gardens</p> </td> <td class="tableHeading" valign="top" style="width:115px"><p class="f-sp"> </p></td> <td class="tableHeading" valign="top" style="width:115px"><p class="f-sp"> </p></td> </tr> <tr> <td valign="middle" style="width:115px; height:24px"><p class="tableBodyLeft">Section:</p> </td> <td valign="middle" style="width:115px"><p class="tableBody">2</p> </td> <td valign="middle" style="width:115px"><p class="f-sp"> </p></td> <td valign="middle" style="width:115px"><p class="f-sp"> </p></td> </tr>Note the non-breaking space. Every carousel that has a spacing problem has this in the cells. How do I get rid of this space?
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
Unfortunately, neither option worked.
The problem is definitely related to empty fields. I added text to the empty fields and the spacing problem went away. That’s why the Buried and Estate carousels look fine—all four columns are populated with data.
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
You’ve applied a margin-bottom of 20px on the P tag, that’s what’s forcing this. Try manually defining the .f-sp style as follows:
<style type="text/css">
.f-sp {
margin: 0;
line-height: 1;
}
</style>
This will override the margin and line-height inherited from the base P tag. You could also put a shift-space (non-breaking space) in the offending cells, and apply your tableBody style to those – they are also set to have zero bottom margin.
Walter
On Oct 2, 2012, at 10:37 AM, RavenManiac wrote:
Unfortunately, neither option worked.
The problem is definitely related to empty fields. I added text to the empty fields and the spacing problem went away. That’s why the Buried and Estate carousels look fine—all four columns are populated with data.
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options
That worked perfectly!
You’re a great detective Walter. Thanks for your help. 
freewaytalk mailing list
email@hidden
Update your subscriptions at:
http://freewaytalk.net/person/options