Images breaking out of content

By kenwen on 9 Aug 2006 at 08:52 UTC

Hi all,

I've been putting together a theme and its coming close to completion but for one error.

On IE, the images in nodes break out of the node box. Works fine in Firefox.

any suggestions on whats going on and how to solve?

the site is http://www.londonkettlebells.com

thanks!

Comments

You're using floats for the

mo6

he/him

Dutch

commented 9 August 2006 at 11:21

You're using floats for the images, right? Try to add:

<div style="clear: both"></div>

as the last markup of your nodes. It will expand the node box in IE6. Note that in IE7 (Strict mode) this issue is fixed.

it works...

kenwen commented 9 August 2006 at 12:06

sorta,

having to add the clears into the nodes themselves :)

This worked for me

PAAHCweb commented 9 August 2006 at 14:37

I had it all: peekaboo text, peekaboo images, and images escaping their nodes.

You might google the "holly hack", that is if your trouble is on IE6. This hack uses another bug in IE6 to override the float problem.

BUT, don't know if it works on IE7. The hack may not work if IE7 fixes the bug that made the hack override the float problem, without fixing the float bug itself.

Sorry if that's explained poorly. It's early here in Arizona.

Cheers,
D. Lynn

Edit node.tpl.php

mo6

he/him

Dutch

commented 9 August 2006 at 17:16

If you're working with a theme which uses the phptemplate engine, you can modify the node.tpl.php file (just add the div before the last closing div). Or, if node.tpl.php doesn't exist in your theme directory, copy it from themes/engines/phptemplate/node.tpl.php and then modify it.

I seem to have a similar problem...

fallacious commented 9 August 2006 at 17:47

...trying to port andreas04 to drupal.

If anybody has the time and inclination, please have a look at http://drupal.daemonz.net/ - FF works fine for me, but IE breaks in interesting ways.

This is my node.tpl.php

kenwen commented 10 August 2006 at 08:41

<div class="node<?php print ($sticky) ? " sticky" : ""; ?>">
<?php if ($page == 0): ?>
<h2><a href="<?php print $node_url ?>" title="<?php print $title ?>"><?php print $title ?></a></h2>
<?php endif; ?>
<?php if ($page != 0): ?>
<h2><?php print $title ?></h2>
<?php endif; ?>

<?php if ($is_front!='true') : ?>
<?php print $picture ?>
<div class="info">
<?php print theme('username', $node) . ' | ' . format_date($node->created, 'custom', 'd/m/Y');
if ($terms) {print ' | in ' . $terms;}
?>
</div>
<?php endif ?>

<div class="content">
<?php print $content ?>
<br class='clear' /><---------- I thought the clear here would work but it doesn't
</div>

<?php if ($is_front!='true') : ?>
<?php if ($links): ?>
<?php if ($picture): ?>
<br class='clear' />
<?php endif; ?>
<div class="links"><?php print $links ?></div>
<div class="terms">( categories: <?php print $terms ?> )</div>
<?php endif; ?>
<?php endif; ?>
</div>

I've cleared it in the above code but doesn't seem to work...