JSFiddle - React, Tailwind, and code Playground
HTML
<table style="height: auto; width: 70%; margin: 0px auto; word-break: break-all;" border="1" cellspacing="0">
<tbody>
<tr style="min-height: 20px;">
<td width="100">
<div style="overflow: auto; text-align: center; background-color: lightblue;">조사내용</div>
</td>
<td> </td>
</tr>
</tbody>
</table>
<div style="height: 7px;"> </div>
<table style="height: auto; width: 70%; margin: 0px auto; word-break: break-all;" border="1" cellspacing="0">
<tbody>
<tr style="min-height: 20px;">
<td width="100">
<div style="overflow: auto; text-align: center; background-color: lightblue;">조사범위</div>
</td>
<td> </td>
</tr>
</tbody>
</table>
<div style="height: 7px;"> </div>
<table style="height: auto; width: 70%; margin: 0px auto; word-break: break-all;" border="1" cellspacing="0">
<tbody>
<tr style="min-height: 20px;">
<td width="100">
<div style="overflow: auto; text-align: center; background-color: lightblue;">결론</div>
</td>
<td> </td>
</tr>
</tbody>
</table>
<div style="height: 7px;"> </div>
<table style="height: auto; width: 70%; margin: 0px auto; word-break: break-all;" border="1" cellspacing="0">
<tbody>
<tr style="min-height: 20px;">
<td width="100">
<div style="overflow: auto; text-align: center; background-color: lightblue;">조사결과</div>
</td>
<td> </td>
</tr>
</tbody>
</table>
<div style="height: 7px;"> </div>
<table style="height: auto; width: 70%; margin: 0px auto; word-break: break-all;" border="1" cellspacing="0">
<tbody>
<tr style="min-height: 20px;">
<td width="100">
<div style="overflow: auto; text-align: center; background-color: lightblue;">관련자료</div>
</td>
<td>
<div style="overflow: auto; text-align: left;">1.특허분석결과</div>
<div style="overflow: auto; text-align: left;">2.검색식</div>
<div style="overflow: auto; text-align: left;"> </div>
</td>
</tr>
</tbody>
</table>
<div style="height: 7px;"> </div>
<table style="height: auto; width: 70%; margin: 0px auto; word-break: break-all;" border="1" cellspacing="0">
<tbody>
<tr...
CSS
table td {
padding: 0;
position:relative;
vertical-align:baseline;
}
td div.content {
position:relative;
display: inline-block;
}
td div.fill{
display: inline-block;
height:100%;
position:absolute;
top:0px;
}
div.pink {
background-color:pink;
}
div.green{
background-color:green;
}
div.fill.pink {
color:pink;
}
div.fill.green{
color:green;
}