I've been digging around the CSS and JS files but I haven't quite found the exact thing that places the throbber.gif where it appears when clicking on 'previous' or 'next'.

The styling is in system.base.css file and I found this declaration:

.ajax-progress .throbber {
    background: url("../../misc/throbber.gif") no-repeat scroll 0 -18px transparent;
    float: left;
    height: 15px;
    margin: 2px;
    width: 15px;

but besides removing the background, the other parts of this declaration do not affect the placement of the throbber.gif.

It's hard to use Firebug and get the styles as the throbber only appears after pushing a button and it's only alive for a few seconds so I've tried screen capturing during the 'throbbing' and measuring distances in the scrn cap in Photoshop and applying but I discovered that the throbber is 'attached' to the button somewhere as it just moves the whole kit and kaboodle... the 'throbber' still appears right next to either 'previous' or 'next' button.

I'm trying to avoid the little jump that happens. When pushing 'next', the 'next' button is shoved left and down a little to make room for the throbber gif, and then shifts back when the new page is loaded.

Any ideas?

  • 1
    your want to override those style rules position the throbbed rather than float it.
    – Alex Gill
    Jun 28, 2013 at 18:42
  • interesting that using position:absolute got rid of it though trying relative with top/left/right/bottom didn't do anything! Jun 28, 2013 at 20:34

1 Answer 1


You can try Views Sexy Throbber, not exactly that you need, but is still cool...

  • Thanks for the link. I got what I needed above, but a new mod to investigate is always fun! Jun 28, 2013 at 20:35

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

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