Обтекание элемента css html
Подскажите пожалуйста, как сделать обтекание меню круглой кнопкой что бы получилось так:
body {
background: grey;
margin: 0px!important;
}
#menu {
width: 100%;
height: 50px;
border-top-left-radius: 30px;
border-top-right-radius: 30px;
background: #fff;
position: fixed;
bottom: 0px;
}
#button {
width: 100%;
height: 100%;
position: absolute;
bottom: 30px;
text-align: center;
}
#button div {
width: 55px;
height: 55px;
background: yellow;
margin-left: auto;
margin-right: auto;
border-radius: 50%;
font-size: 30px;
border: 4px solid #fff;
}<body>
<div id="menu">
<div id="button">
<div>
+
</div>
</div>
</div>
</body>