JSFiddle - React, Tailwind, and code Playground

HTML

<div id="container">
    <div class="relative">
        <div id="prosto_div">blabla</div>
    </div>
    <div class="relative">
        <input type="text" value="bloblo" id="input1" style="position:relative;left:0;right:0;padding-left:10px;">
    </div>
    <div class="relative">
        <div id="container2">
            <input type="text" value="blyablya" id="input2" style=" border: medium none; padding:0;">
        </div>
    </div>
</div>

CSS

div{
    border-width:2px;
    border-style:solid;
}
#container{
    position:relative;
    border-color:red;
    width:300px;
}
#prosto_div{
    position:absolute;
    left:0;
    right:40px;
    border-color:green;
    padding:0 10px;
}
#input1{
    position:relative;
    left:0;
    right:0;
    padding:0 10px;
}
#container2{
    position:absolute;
    left:0;
    right:40px;
    border-color:blue;
    padding: 0 5px;
}
#input2{
    position:relative;
    width:100%;
    padding:0 10px;
}
.relative{
    position:relative;
    height:50px;
    border-color:grey;
    margin:0 0 4px;
}