theme_filefield_file() right now returns a DIV with the clear-block class, presumably because it contains a floated icon that it wants to clear.

The problem with having clear-block or clearfix at the field level, though, is that it doesn't play nice with floats elsewhere in the node. See the attached screenshot with the clear-block; .clear-block (or rather, .clear-block:after) is pushing out to clear past the floated imagefield image.

I'm not sure that float clearing is really necessary in the default generic formatter, so here's a patch taking it out, with another screenshot after the fix.

Members fund testing for the Drupal project. Drupal Association Learn more

Comments

srobert72’s picture

Subscribe.

It solves problem under which browser ?
I think I have same issue but only under IE7, do you confirm ?

Les Lim’s picture

srobert72: Actually, no. In this case, IE6 and IE7 should both display fine without the patch. The problematic CSS is part of .clear-block:after, which affects only modern browsers that recognize the :after pseudo-class. That would include Firefox, Safari and IE8.

matteogeco’s picture

Subscribing

stongo’s picture

I had to add a break at the end of the patched line to make it work properly

  return '<div class="filefield-file">'. $icon . l($link_text, $url, $options) .'</div><br />';
Geijutsuka’s picture

subscribing

quicksketch’s picture

Status: Needs review » Fixed
FileSize
4.13 KB

lesmana correctly identified the reason for the "clear-block" class in the original description: "presumably because it contains a floated icon that it wants to clear."

This is correct. That means that in order to remove the "clear-block" class we need to remove the DIV around the icon that needs to be floated. Since I can't find any reason for putting a wrapper around the icon at all (it's already going to be the only image inside of a .filefield-file div), I'd prefer to just remove the wrapper around the icon entirely and let the image display as it would normally.

While looking at our CSS and markup, I also couldn't find any reason for several of our styles and the RTL support is pretty inaccurate. I've committed these changes which also include the removal of the clear-block class.

quicksketch’s picture

Title: .clear-block in default filefield formatter breaks node layouts with floated elements » Remove .clear-block in default filefield formatter which breaks node layouts with floated elements

Status: Fixed » Closed (fixed)

Automatically closed -- issue fixed for 2 weeks with no activity.