JSFiddle - React, Tailwind, and code Playground

HTML

<div style=" width:100%; height:1px; clear:both;">.</div>

<div id="first" >Поисковая форма</div>
<div id="koreshok">
<div id="second" >Расширенный поиск</div>
<div id="triangle-topleft" ></div>
</div>
<div style=" width:100%; height:1px; clear:both;"></div>

CSS

#first{
  width:500px;
  height:100px;
  background-color: #333;
  border-radius: 4px 4px 4px 0;
}
#second{
  width:150px;
  height:20px;
  background-color: #333;
}
#koreshok{
 //float:left;
}
#second{
  float:left;
  width:150px;
  height:20px;
  background-color: #333;
  border-radius: 0 0 0 4px;
}
#triangle-topleft {
  float:left;
	width: 0;
	height: 0;
	border-top: 20px solid #333; 
	border-right: 20px solid transparent;			
}