我正在试着列出我公司的服务清单。 我想象16:9显示器上的两个细胞是这样的。
我想用HTML中的表来实现这一点:
null
<table style="width:100%">
<tr>
<th>service</th>
<th>service</th>
</tr>
<tr>
<td>text text text </td>
<td>text</td>
</tr>
<tr>
<th>service</th>
<th>service</th>
</tr>
<tr>
<td>text text text text</td>
<td>text text</td>
</tr>
</table>null
这确实有效，但右侧较长的文本会停在左侧下一个服务标题的开头。 我想让左边的细胞独立于右边。
我怎样才能解决这个问题呢？
您可以从以下内容开始:
玩来玩去。
null
.MainDiv {
height: 800px;
width: 100%;
border: 1px solid red;
display: flex;
padding: 10px;
}
.leftDiv {
height: 800px;
width: 50%;
border: 1px solid blue;
margin: 10px;
}
.rightDiv {
height: 800px;
width: 50%;
border: 1px solid blue;
margin: 10px;
}<div class="MainDiv">
<div class="leftDiv">
<h1>
Service title
</h1>
left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left
<h1>
Service title
</h1>
left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left
left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left
left left left left left left left
<h1>
Service title
</h1>
left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left left
</div>
<div class="rightDiv">
<h1>
Service title
</h1>
Right right right right right right Right right right right right right Right right right right right right Right right right right right right Right right right right right right Right right right right right right Right right right right right right
Right right right right right right Right right right right right right Right right right right right right Right right right right right right Right right right right right right Right right right right right right Right right right right right right
Right right right right right right
<h1>
Service title
</h1>
Right right right right right right Right right right right right right Right right right right right right Right right right right right right Right right right right right right
<h1>
Service title
</h1>
Right right right right right right Right right right right right right Right right right right right right Right right right right right right Right right right right right right
</div>
</div>