I am using draggable table in my new theme. Every thing is working properly but

I want to show this icon like in Bartik theme for every draggable rows:-

enter image description here

Currently it is showing as

enter image description here

How to change this?


I suspect it's similar to a problem I had with draggable table rows in a zen subtheme: the icon was just a bit mis-placed. Using Firebug or similar tools you can see what's going on – on my site it looked like this:

enter image description here

Using firebug I could see the reason for this:

enter image description here

The icon was mis-placed. So I suppose you probably don't have to change the draggable icon itself, but you'll have to adjust the position of the icon.

The css responsible for the position should look like this:

a.tabledrag-handle .handle {
background: url("../../misc/draggable.png") no-repeat scroll 6px 9px rgba(0, 0, 0, 0);
height: 13px;
margin: -0.4em 0.5em;
padding: 0.42em 0.5em;
width: 13px;

and you should find it in this system css file: /modules/system/system.base.css

Instead of changing it in that system css file you should however override the settings in your theme's css file. You probably don't have to change much – just have to play around with the settings for margin and padding according to your theme… Hope this helps somehow?

  • You Rock Man!! Thanks for pointing me in right direction. After playing around I get my icon as desired. Thanks for help again. Sep 13 '14 at 12:02

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Not the answer you're looking for? Browse other questions tagged or ask your own question.