缩小时防止选择更改尺寸

时间:2021-01-24 12:08:54

标签: html css

当我使文本变小时,有没有一种方法可以防止选择图标变大?

放大 100%

放大 40%

你看,好像自定义图标下面的select图标变大了。我希望这不会发生。 提前致谢!

  .quantityDiv {
        display: flex;
        align-items: center;
        justify-content: center;
        padding-bottom: 15px;
        width: 50px;
    }
    
    .quantityDiv p {
        padding-bottom: 0px;
        padding-right: 5px;
    }
    
    .quantityDiv .customSelectCat select{
        font-size: 16px;
        padding: 2px;
        min-width: 50px;
        max-width: 50px;
    }
    
    .quantityDiv .customArrowCat::before {
        border-left: 6.4px solid transparent;
        border-right: 6.4px solid transparent;
        border-bottom: 6.4px solid rgb(255, 255, 255);
        top: 32%;
    }
    
    .quantityDiv .customArrowCat::after {
        border-left: 6.4px solid transparent;
        border-right: 6.4px solid transparent;
        border-top: 6.4px solid rgb(255, 255, 255);
        top: 68%;
    }
    
    .quantityDiv .customArrowCat {
        width: 24px;
        display: inline;
        background: #3b3c47;
    }
 <div class="quantityDiv">
    <p>Quantità: </p>
    <div class="customSelectCat">
        <select id="quantity0">
            <option value="1" selected="selected">1</option>
            <option value="2">2</option>
            <option value="3">3</option>
            <option value="4">4</option>
            <option value="5">5</option>
        </select>
        <span class="customArrowCat"></span>
    </div>
</div>

0 个答案:

没有答案