Board Thread:Support Requests - Getting Technical/@comment-24729554-20151102145522

I'm using a template that displays audio in a separate box when you hover over an image. If the right edge of the box overlaps the right rail, it gets clipped so that you can only see the bit within the main content space. I've included an image in case this description isn't very good, and here is where I'm experiencing the problem (hover over the first 2 play icons). Obviously, I want the full box to be displayed, even if it partially overlaps the right rail.



Here is the template I'm using and this is the corresponding CSS:

.np-quote-snd-trigger { display: inline-block; position: relative; top:auto; left:auto; padding: 0px 2px; } .np-quote-snd-trigger:hover .np-quote-snd-player { display:block; } .np-quote-snd-player { display:none; position:absolute; top:-55px; left:100%; z-index:100 !important; width: 300px; overflow: visible; margin:0; padding:5px 10px 10px 10px; border:1px solid #212121; border-radius:5px; box-shadow:#515151 2px 2px 5px 0; background-color:#212121; color: White; text-align: left; font: normal normal normal 13px/normal Helvetica,Arial,sans-serif; } .np-quote-snd-player-img { float:left; width:50px; } .np-quote-snd-player-title { width:250px; height:50px; display:table-cell; vertical-align:middle; } .np-quote-snd-player-title span { font-size: 18px; }

I thought the "overflow" property might affect this, but I've changed it a few times and it seems to have made no difference. Any help would be appreciated. 