JSFiddle - React, Tailwind, and code Playground

HTML

<header>
    <div class="myHeader">H</div>
</header>
<div id="body">
    <div class="myContent">
        <div class="leftPart">A</div>
        <div class="rightPart">
            <div>
                <label for="Sales_and_Marketing">Sales and Marketing</label>
                <input id="SalesAndMarketing" name="SalesAndMarketing" type="text" value="" />
            </div>
            <div>
                <label for="Sales_and_Marketing">Sales and Marketing</label>
                <input id="Text1" name="SalesAndMarketing" type="text" value="" />
            </div>
        </div>
    </div>
</div>
</body>

CSS

.myContent {
    width: 100%;
    overflow: hidden;
    border: 2px solid black;
}
.myHeader {
    width: 100%;
    overflow: hidden;
}
.leftPart {
    border: 1px solid blue;
    width: 200px;
    height:200px;
    float:left;
    background-color: orange;
}
.rightPart {
    border: 1px solid orange;  
    background-color: beige;
    margin-bottom: -1000px;
    padding-bottom: 1000px;
    margin-right: -5000px;
    padding-right: 5000px;
    text-align:center;
}
.rightPart div {
    overflow:hidden;
}
@media all and (max-width : 365px)
{
    .leftPart {
        width:100%;
    }
    .rightPart {
        float:left;
    }
}