Question: I want to use the jQuery UI shake effect in combination with the CSS style `position: absolute`, but that just works in Firefox. In all other browsers the effect interrupts the CSS style.

I want that the `div` is horizontally and vertically aligned and that the shake effect works without disabling the `position: absolute`. But I can't get it working.

Here is my [JSFIDDLE.](http://jsfiddle.net/DG4th/1/)

```
<div class="toggle"></div>

```

```css
.toggle {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
    margin: auto;
    width: 100px;
    height: 100px;
    background: #ccc;
}

```

```js
$(".toggle").click(function () {
    $(this).effect("shake", {
        direction: "left",
        times: 4,
        distance: 5
    }, 30);
});

```

Answer: 
Okey, I got it.
I add a holder around the `<div class="toggle"></div>` and set them to the vertical and horizontal center. Therefore I can delete the "position:absolute" on my `<div class="toggle"></div>` and the ui effect stops to interrupt.

BTW: The Shake-Effect doesn't disable the "position:absolute", but it creates a new div around the shaking element, which is called `<div class="ui-effects-wrapper" style="...">...</div>`

Here is the final code, which works on every browser. [JSFIDDLE](http://jsfiddle.net/DG4th/2/)

**HTML**

```
   <div class="holder">
     <div class="toggle"></div>
   </div>

```

**CSS**

```
 .holder {
     position: absolute;
     top: 0;
     right: 0;
     bottom: 0;
     left: 0;
     margin: auto;
     width: 100px;
     height: 100px;
     overflow:visible;
 }

 .toggle {
     width:100px;
     height:100px;
     background:#ccc;
 }

```

**JAVASCRIPT**

```
$(".toggle").click(function () {
    $(this).effect("shake", {
        direction: "left",
        times: 4,
        distance: 5
    }, 30);
});

```
I found another solution that may be useful to someone: Unwrap the added ui-effects-wrapper div, and reset the css...

```
if ( $('.toggle').parent().is( ".ui-effects-wrapper" ) ) {
     $('.toggle').unwrap();
}
$('.toggle').css('position', 'absolute'); // set any other css position values which may have been overwritten (top, left, etc.)

```

This was the only thing I could make work in my situation.