<dl class="my_table01">
<dt>項目1</dt>
<dd>テスト文字列テスト文字列テスト文字列テスト文字列テスト文字列</dd>
<dt>項目2</dt>
<dd>テスト文字列テスト文字列テスト文字列テスト文字列テスト文字列テスト文字列テスト文字列テスト文字列テスト文字列テスト文字列テスト文字列テスト文字列テスト文字列テスト文字列</dd>
</dl>
scss
.company_list_container {
width: 782px;
dl{
display:flex;
flex-wrap: wrap;
border: 1px solid #ccc;
border-top: none;
}
dt{
background: #ddd;
width: 30%;
padding: 10px;
box-sizing: border-box;
border-top: 1px solid #ccc;
}
dd{
padding: 10px;
margin: 0;
border-left: 1px solid #ccc;
border-top: 1px solid #ccc;
width: 70%;
background: #fff;
box-sizing: border-box;
}
}
ただし、項目名のほうが長い場合は崩れます。