<html>

<head>
<style type="text/css">
    #edit_status_select { line-height: 25px; width: 200px; background: cyan; border: 1px solid #777; }
    #edit_status_select a { display: block; background: white; }
    wbr:before { content: "\0"; } /* :after also causes it */
</style>
</head>

<body>
    You should not see any cyan.
    <div id="edit_status_select">
        <a href="#">foo<wbr>bar</a>
    </div>
</body>
</html>