JSFiddle - React, Tailwind, and code Playground

by Dhruvil Patel

HTML

<li id="area--5F43005:RESOCCHAZ--5F1" class="row">
    <fieldset>
        <div class="col_question">
            4. As part of your occupation, do you work at etc. ect. 
        </div>

        <div class="holder">
            <input type="hidden" name="43005:RESOCCHAZ--5F1_life_1" id="trigger_43005:RESOCCHAZ--5F1_life_1" value="true">

            <div class="col_answer" id="answ_43005:RESOCCHAZ--5F1_life_1">
                No&nbsp;
            </div>

            <div class="col_select">
                <input id="btn_true_43005:RESOCCHAZ--5F1_life_1" name="btn_true_43005:RESOCCHAZ--5F1_life_1" class="ure_btn" type="submit">
                <input id="btn_false_43005:RESOCCHAZ--5F1_life_1" name="btn_false_43005:RESOCCHAZ--5F1_life_1" class="ure_btn" type="button" value="no">
           </div>
        </div>
    </fieldset>
</li>

CSS

* {
    box-sizing: border-box;
}
li {
  list-style-type: none;
}
.col_question{
    display: inline-block;
    border-style: groove;
    padding:6px;
    display: table-cell;
    width: 33.33%;
}

.col_answer{
display: inline-block;
border-style: groove;
padding:6px;
}

.col_select{
border-style: groove;
padding:6px;
}

fieldset{
border:none;
-webkit-margin-start: 0px;
-webkit-margin-end: 0px;
-webkit-padding-before: 0px;
-webkit-padding-start: 0px;
-webkit-padding-end:0px;
-webkit-padding-after:0px;
min-width:0px;
display: table;
 width: 100%;
}
.holder {
    display: table-cell;
    width: 66.66%;
}
.holder > div {
    width: 50%;
    display: inline-block;
    margin: 0;
    float: left;
}