CSS 位置绝对会在元素容器中取消对齐，否则如果位置是相对的，则元素容器会对齐。它必须是绝对的，因为单击时该元素中会出现一个下拉列表，并且我希望它不会破坏下面的容器。
这是 html 和 css 代码：
<div class="section-2-content product-sections">
<div class="section2-clmn">
<div>
<h5 class="info-type">TYPE</h5>
</div>
<div>
<h6 class="info-type-display product-type" alt="Edible">Edible</h6>
</div>
</div>
<div class="section2-clmn">
<div>
<h5 class="info-type">LINEAGE</h5>
</div>
<div>
<h6 class="info-type-display lineage-main">Hybrid</h6>
</div>
</div>
<div class="section2-clmn">
<div>
<h5 class="info-type">THC</h5>
</div>
<div>
<div class="thc-drop-down-wrapper">
<div class="thc-top">
10mg/serving
</div>
<div class="thc-main">
100mg/container
</div>
</div>
</div>
</div>
<div class="section2-clmn">
<div>
<h5 class="info-type">QUANTITY</h5>
</div>
<div>
<h6 class="info-type-display">10</h6>
</div>
</div>
<div class="section2-clmn">
<div>
<h5 class="info-type">Variant</h5>
</div>
<div>
<div class="strain-drop-down-wrapper">
<div class="strain-top">
Original </div>
<div class="strain-main">
<a href="https://6bq.107.myftpupload.com/product/balance-gummies/">
<p class="strain-name" alt="Balance">
Balance </p>
</a>
<a href="https://6bq.107.myftpupload.com/product/gold-high-dose-gummies/">
<p class="strain-name" alt="Gold High Dose">
Gold High Dose </p>
</a>
<a href="https://6bq.107.myftpupload.com/product/gold-super-high-dose-gummies/">
<p class="strain-name" alt="Gold Super High Dose">
Gold Super High Dose </p>
</a>
<a href="https://6bq.107.myftpupload.com/product/live-resin-gummies/">
<p class="strain-name" alt="Live Resin">
Live Resin </p>
</a>
<a href="https://6bq.107.myftpupload.com/product/original-gummies/">
<p class="strain-name" alt="Original">
Original </p>
</a>
<a href="https://6bq.107.myftpupload.com/product/rest-gummies/">
<p class="strain-name" alt="Rest">
Rest </p>
</a>
<a href="https://6bq.107.myftpupload.com/product/rise-gummies/">
<p class="strain-name" alt="Rise">
Rise </p>
</a>
</div>
</div>
</div>
</div>
</div>
.single-product .info-type-display{
border: 1px solid #001733;
border-radius: 25px;
font-size: 16px;
font-weight: normal;
padding-right: 40px;
padding-left: 40px;
padding-top: 3px;
padding-bottom: 3px;
}
/*Flower, Vape, Preroll Main Strain Container*/
.single-product .strain-drop-down-wrapper{
border: 1px solid #001733;
background-color: #ffffff;
border-radius: 25px;
padding-right: 10px;
padding-left: 10px;
padding-top: 3px;
padding-bottom: 3px;
width: 232px;
scrollbar-width: none;
position: relative;
transition: border-radius 0.3s, height 0.3s;
}
.single-product .strain-top{
font-size: 16px;
font-weight: normal;
color: #FFC000;
}
a p.strain-name {
color: #001733;
}
.single-product .strain-main{
font-size: 16px;
font-weight: normal;
max-height: 115px;
scrollbar-width: none;
overflow-y: scroll;
display: none;
position: relative;
transition: opacity 0.3s, display 0.3s;
opacity: 0;
}
尝试放入另一个 div 并定位它....??元素本身的不同定位。
您是否尝试过使用相对于父容器的方式？ 当您使用元素的绝对位置时，它的父元素应该具有相对位置。 如果您遇到其他问题，这可能没有帮助。