<!doctype html>
<html>
<head>
<style>
.logo {
    width: 6em;
    height: 6em;
    background-color: gray;
    float: right;
    shape-outside: inset(1em 0px 0px 0px);
}
p { overflow: hidden; margin-right: 3em; }
</style>
</head>
<body>
<div class="logo"></div>
<p>This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box. This paragraph should be next to the grey box.</p>
</body>
</html>