Skip to main content

Search and Top Navigation

#5129 closed bug (fixed)

Opened February 04, 2010 12:53PM UTC

Closed March 07, 2013 05:55PM UTC

Last modified March 07, 2013 05:55PM UTC

Sortable: Unable to use an image as a placeholder in Firefox

Reported by: zerxer Owned by: scottgonzalez
Priority: minor Milestone: 1.10.2
Component: ui.sortable Version: 1.7.2
Keywords: sortable image placeholder Cc:
Blocked by: Blocking:


Basically, see here:

Firefox (and possibly some other browsers?) do not let you style an empty IMG tag with a width/height, so there's a broken placeholder under your sortable. Chrome seems to do just fine though and apply the width/height to the image.

I've fixed this on my site once already in the past (forgot to report this), but noticed it pop up again when I updated to the latest files. My fix was basically to put ".attr('src', 'url to a spacer gif')" in the _createPlaceholder function where it defines the "f" variable in the e.placeholder.element function.

Attachments (0)
Change History (7)

Changed February 04, 2010 12:55PM UTC by rdworth comment:1

Another workaround would be to set display: inline-block in the css for ui-sortable-placeholder. See

Changed October 03, 2012 05:00PM UTC by scottgonzalez comment:2

milestone: 1.next2.0.0

Changed November 06, 2012 01:37PM UTC by mikesherov comment:3

status: newopen

Changed March 07, 2013 03:45AM UTC by tj.vantoll comment:4

summary: sortable: using sortables on images causes placeholder issuesSortable: Unable to use an image as a placeholder in Firefox

Confirmed this is still an issue on 1.10.1: Adding

 img.ui-sortable-placeholder { display: inline-block; } 
fixes this.

I think we should either land that or close this as wontfix since this is a bit of an edge case that's easy to workaround. I'm leaning towards putting something in to handle this. Thoughts?

Changed March 07, 2013 05:42PM UTC by scottgonzalez comment:5

owner: → scott.gonzalez
status: openassigned

I think the ideal fix is setting the src to match the item being sorted.

Changed March 07, 2013 05:55PM UTC by Scott González comment:6

resolution: → fixed
status: assignedclosed

Sortable: Copy the src of the original item when creating a placeholder from an image. Fixes #5129 - Sortable: Unable to use an image as a placeholder in Firefox.

Changeset: b9be6bb7ad107fd48b28e31df972b2037c47c2cb

Changed March 07, 2013 05:55PM UTC by scottgonzalez comment:7