Playbar overlay looks different in skin editor compared to when publishing

I have the Playbar Overlay option checked in the skin editor, and in the skin editor preview it looks exactly as I need, but for some reason when I publish the playbar vertically squashes the entire module to make room for the playbar. Also, in the preview the play buttons (forward, back, mute etc) are nicely aligned left while when publishing they are stretched full width horizontally. I have tried several different skins and playbar themes but it is having the same effect each time.

Is there some setting that I am missing or what can I do to fix this?