I'm using viewport-units-buggyfill to cover `vw` and `vh` measures. I have to use `content` in css to create a good fallback, all works fine but, for a reason that I don't understand, Safari doesn't let me animate `:hover` if it the code has css `content` inside, here is the problem (tested on Safari 8/Mac and iOS8)

<https://fiddle.jshell.net/nc9chuod/>

Any idea what's I'm doing wrong?

```css
div {
  border: 1px solid black;
  padding: 20px;
  position: fixed;
  width: 100vw;
  min-height: 50vh;
  -webkit-transition: all 0.3s ease-out;
  transition: all 0.3s ease-out;
  content: "not-a-problem";
  overflow: hidden;
}
div:hover {
  -webkit-transform: translate3d(50vw, 0, 0);
  transform: translate3d(50vw, 0, 0);
  content: "not-working";
}
```

```html
<div id="transition"></div>
```