Need help applying overflow:auto to post content on display.template.php

Started by ShaqZigWINNER64, July 18, 2011, 05:30:36 PM

Previous topic - Next topic

ShaqZigWINNER64

EDIT: I figured it all out now so I marked this as solved

Hello,
I'm working on a theme for a friend's website for when we upgrade the forums from smf 1.1x to smf 2. It uses the curve theme as a base though I'm starting from scratch on a lot of things.

On display.template.php though I'm running into a bit of trouble in stopping large posts from stretching the page horizontally. Here's what I have so far: hxxp:somuchdamage.com/smf2/index.php?topic=12.0 [nonactive]. That left column with the avatars is to be fixed at 170px while the right column (that contains the post ) is to scale to occupy the rest of the horizontal space. At the moment that's done automatically by the browser, no width is assigned to the right column, instead the width of the containing <table> is fixed at 100%. The code for each post looks something like this:

<div class="content"> //Generic content container, no problem with this
<table><tr>
<td class="posterinfo">Left column here with avatar etc</td>
<td class="postcontent">//Right column that has the main post
<div class="postbody">POST GOES HERE</div>
</td></tr></table></div>

.content table is specified in the stylesheet as having a fixed width of 100%, .posterinfo has width of 170px. The idea is that when a large image or something is posted, .postbody scrolls horizontally instead of expanding. To do that I specified

.postbody
{
width: 100%;
max-width: 100%;
overflow: auto;
}


But here's how it works in practice: hxxp:somuchdamage.com/smf2/index.php?topic=12.0 [nonactive]. As far as I can tell, because no width is assigned to <td class="postcontent"> the browser thinks it's free to enlarge it. This is one thing I never managed to get quite right but previous themes I did for the site were fixed width so it was no problem assigning a width to both columns. For this one I have no idea what to put as the width for the right column so it stretches to fill the width but does not go beyond that (or what else I could do to get this working). It's probably something simple that I missed but I'm just not seeing it

For what it's worth I also tried scrapping tables altogether and just using divs instead which seemed promising but I also had problems with those. If anyone thinks this is a better avenue I can post details about those problems if they're willing to help.

Here is the (admittedly untidy) css file: hxxp:somuchdamage.com/smf2/Themes/default/css/index.css [nonactive]

Thanks

Advertisement: