Percentage margin is always relative to the containing block's width, so this won't work like you expect.
If you're open to an alternative, I suggest instead using:
.parent {
position: relative;
}
.child {
-o-transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
position: absolute;
right: 100%;
top: 50%;
}
Updated fiddle (this is supported quite well except for IE8)