By szaijan on

I would like to get my post teasers to truncate such that images do not extend past the bottom of the containing box. Currently, if I cut an article off at some arbitrary text limit and the length of the text does not push the box size to a greater height than an included image, the image extends past the bottom border.

I want to use images that text wraps around. I can get this to work by including a div around the image with a height greater than that of the image, but that causes the text to begin below the div. I could also manually include the text I want in the teaser in such a div, but that would often create artificial and unwanted spacing in the complete article view.

Ideally, the block height for a post would set by the character truncation limit or the maximum height of all inserted images appearing before the paragraphs included in the teaser.

Any ideas on how to address this problem would be greatly appreciated.

⋅ Categories: Drupal 5.x

Comments

szaijan’s picture

szaijan commented

Bumped off the first page with no answers. Is this impossible, or so easy I don't deserve an answer (i.e. should have RTFM?)

joachim’s picture

joachim commented

Set class="clear-block" on the DIV that has the border.
This will extend the bottom border to enclose the image.

szaijan’s picture

szaijan commented

Thanks Joachim! Can anyone point me to a good way to implement this on the Drupal site? The DIV in question needs to be part of the blog block, so I thought I could simply append the class "clear-block" to the #content entry in the theme's CSS, but no joy. Putting such a DIV around the entire article causes the BLOG box to extend and contain all of the articles below it, so that doesn't work. I assume that's because the Teaser truncation doesn't close the DIV tag, which ends well after the truncation limit.

EDIT: Got it! My site is using a variant of the bluemarine theme by default, so I needed to add clear-block to the DIV class declaration in the node.tpl.php file. This is problematic in that in only fixes a single theme and could have unforseen effects on other uses of the node. I'll report here if I encounter any other issues, but I'd still love to hear if anyone has a better solution. I'd much rather handle this in CSS.