There is a site header and its logo, I would like to remove a piece of the border , so that there is a completely gray inner fill.

Cap

Red rectangle - visual "patch" (made by div ).

Are there any more traditional problem solving methods? Thank you in advance!

  • block with the words home to make the above is not an option? - ishidex2
  • @Duoxx in what sense? - NickGrom
  • Add the code, nothing is clear - E_K

1 answer 1

So?

 .menu-block { display: block; position: relative; } .logo { width: 80px; height: 80px; background: #888; border: 5px solid #333; border-radius: 10px; box-sizing: border-box; position: absolute; left: 0; } .menu { width: calc(100% - 80px); height: 60px; background: #888; border: 5px solid #333; border-left: 0; /* Убираем бордер с левой части */ border-radius: 0 10px 10px 0; /* Убираем скругление углов с левой части */ box-sizing: border-box; position: absolute; left: 75px; top: 10px; } 
 <div class="menu-block"> <div class="logo"></div> <div class="menu"></div> </div>