この例のhtml行の数は少し多すぎます。ご容赦ください（ただし、少なくともブラウザで直接開くことができるので、非常に便利です）。
その理由は、2つのテーブルを同じ行に並べて配置したいということです。最初のアイデアは、次のようにすることです（2つの<div>を<table>に合わせて取得し、の幅のパーセンテージを設定します。各<div>）。
<html>
<body>
<h1 id="div2" align="center" style="margin-bottom:0px;padding-bottom:0px;font-size:1.625em;">so compare</h1><br>
<div style="width:20%;hight:100%;float:left;">
<table style="border-collapse:collapse;border:1px outset black;">
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">package</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">centos7.6</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">glibc</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libc-2.17.so</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">glibc</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libdl-2.17.so</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">glibc</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libpthread-2.17.so</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">pcre</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libpcre.so.1.2.0</td>
</tr>
</table>
</div>
<div style="width:80%;hight:100%;float:left;">
<table style="border-collapse:collapse;border:1px outset black;">
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">package</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">openEuler20.03</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">glibc</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libc-2.28.so</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">glibc</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libdl-2.28.so</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">glibc</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libpthread-2.28.so</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libxcrypt</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libcrypt.so.1.1.0</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">openssl-libs</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libcrypto.so.1.1.1f</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">openssl-libs</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libssl.so.1.1.1f</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">pcre</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libpcre.so.1.2.12</td>
</tr>
</table>
</div><br><hr>
</body>
</html>効果は次のとおりです。
分割線がテーブルの下部に近いことを除いて（2番目の<table>の外側に<form> </ form>を配置して解決できます）、問題はないようです。
しかし、Webページをズームすると、問題が明らかになりました。
ズームインした後、2つのテーブルが実際に部分的に重なっていたので（これは私が望んでいたものではありません）、別の方法を考えなければなりませんでした。
したがって、2つの<table>を同じ行に並べて配置できるようにするために（何があっても、それらは重ならない）、2つの<table>をそれぞれの<div>でラップし、 style style = "display：inline-block"の場合。
<html>
<body>
<h1 id="div2" align="center" style="margin-bottom:0px;padding-bottom:0px;font-size:1.625em;">so compare</h1><br>
<div style="display:inline-block;margin-right:20px;float: left;">
<table style="border-collapse:collapse;border:1px outset black;">
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">package</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">centos7.6</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">glibc</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libc-2.28.so</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">glibc</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libdl-2.28.so</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">glibc</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libpthread-2.28.so</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libxcrypt</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libcrypt.so.1.1.0</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">openssl-libs</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libcrypto.so.1.1.1f</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">openssl-libs</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libssl.so.1.1.1f</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">pcre</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libpcre.so.1.2.12</td>
</tr>
</table>
</div>
<div style="display:inline-block;float: none;">
<table style="border-collapse:collapse;border:1px outset black;">
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">package</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">openEuler20.03</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">glibc</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libc-2.17.so</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">glibc</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libdl-2.17.so</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">glibc</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libpthread-2.17.so</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">pcre</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libpcre.so.1.2.0</td>
</tr>
</table>
</div>
<br><br><hr>
</body>
</html>上記のhtmlは、図に示すような効果を実現できます。
しかし、ガチョウの厄介な問題は、最後の<hr>分割線が線全体を通過しないことです。これは、私が望むものではありません（もちろん、分割線が線全体を通過し、通過しないことを願っています）テーブル）。
解決策：2つの<div>の外側に<div>の別のレイヤーを配置し、最も外側の<div>のスタイルを<div style = "display：inline-block">に変更します。
最終的な効果は次のとおりです（ズームインおよびズームアウトでき、オーバーラップしなくなります）。
<html>
<body>
<h1 id="div2" align="center" style="margin-bottom:0px;padding-bottom:0px;font-size:1.625em;">so compare</h1><br>
<div style="display:inline-block">
<div style="display:inline-block;margin-right:20px;float: left;">
<table style="border-collapse:collapse;border:1px outset black;">
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">package</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">centos7.6</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">glibc</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libc-2.28.so</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">glibc</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libdl-2.28.so</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">glibc</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libpthread-2.28.so</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libxcrypt</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libcrypt.so.1.1.0</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">openssl-libs</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libcrypto.so.1.1.1f</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">openssl-libs</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libssl.so.1.1.1f</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">pcre</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libpcre.so.1.2.12</td>
</tr>
</table>
</div>
<div style="display:inline-block;float: none;">
<table style="border-collapse:collapse;border:1px outset black;">
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">package</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">openEuler20.03</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">glibc</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libc-2.17.so</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">glibc</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libdl-2.17.so</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">glibc</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libpthread-2.17.so</td>
</tr>
<tr>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">pcre</td>
<td class="row" style="background-color:#eeeeee;font-weight:bold;text-align:left;font-size:0.94em;white-space:nowrap;border:1px inset gray;padding: 3px;">libpcre.so.1.2.0</td>
</tr>
</table>
</div>
</div>
<br><br><hr>
</body>
</html>