Crop Area Overlaps/Covers Preview in Firefox

Got that issue too.

A quick-fix would be nice :-)

me too

It is an issue with the filefield module and your theme actually, as the filefield module adds CSS which does this:

filefield.css, lines 27-38:

.filefield-element .widget-preview {
  float: left; /* RTL */
  padding-right: 10px; /* RTL */
  border-right: 1px solid #CCC; /* RTL */
  margin-right: 10px; /* RTL */
  max-width: 30%;
}
 
.filefield-element .widget-edit {
  float: left; /* RTL */
  max-width: 70%;
}

It's the float attributes here that are the cause of your problem. To fix it, add this in your theme's CSS:

.filefield-element .widget-preview, 
.filefield-element .widget-edit {
  float: none;
}

Note that this may break other filefield widgets or make them look funny. To work around this, you need to be more specific in your CSS, for example:

#edit-field-crop-image-0-ahah-wrapper .filefield-element .widget-preview, 
#edit-field-crop-image-0-ahah-wrapper .filefield-element .widget-edit {
  float: none;
}

Note that the id attribute used here (#edit-field-crop-image-0-ahah-wrapper) is on a node type with only one imagefield_crop widget. If you have more of those widgets (ie. more than one imagefield_crop field) on the same node type, you have to add more lines of css with for example #edit-field-crop-image-1-ahah-wrapper ... and so on (increasing the number, which starts at 0, not 1 for the first widget).

I am experiencing the same issue however for me the crop area and marquee do not get displayed. I have incorporated the float:none fix above which enables the 'Crop area:' to render beneath the photo but still not working. Screenshot attached.

Any help appreciated. This issue doesn't occur for me on localhost... only on my web host.

Subscribe.

Croppable image also overlaps the final image on my site.

subscribing

Crosslinking - Duplicate Issue http://drupal.org/node/658464

I am experiencing the same issue however for me the crop area and marquee do not get displayed. I have incorporated the float:none fix above which enables the 'Crop area:' to render beneath the photo but still not working. Screenshot attached.

Any help appreciated. This issue doesn't occur for me on localhost... only on my web host.

@ghiley - I used to get that too especially with larger file size images. Have you tried the latest RC1? That particular issue appears to be resolved with the RC1 release.

This has been fixed in #658464: Crop window overlays preview window