我的页面上有几个未排序的列表.两个列表都使用list-style: disc inside;.每个列表的列表项都有几个div.问题是列表项的内容占用多行,并且光盘垂直出现在多行列表项的底部.
这是一个屏幕截图,显示了我遇到的问题.请注意,我从类似的问题中偷走了图像,它不是我的HTML或CSS.
这是我的HTML的条纹版本:
<html>
<head>
<link rel="stylesheet" type="text/css" href="style.css">
</head>
<body>
<div id="billing_form">
<div id="purchase_items">
<h2>Your purchase</h2>
<h4>Items:</h4>
<div class="items">
<ul>
<li>
<div class="item">First Product - one year license</div>
<div class="price">$99.00 USD</div>
</li>
<li>
<div class="item">Second product & 3 year Product Plan</div>
<div class="price">$125.00 USD</div>
</li>
</ul>
</div>
<div class="subtotal">SUBTOTAL: $224.00 USD</div>
<h4>Discounts:</h4>
<div class="discount">
<ul>
<li>
<div class="item">A really long discount item name - with extra info on three lines!</div>
<div …