Question

为什么我无法在border-radius上制作<dt>？

http://thistedbolig.konggulerodhosting.dk/

我可以改变什么？我真的需要制作border-radius。我尝试了很多东西，但没有一个能奏效。我希望有人可以帮助我，这样我就能完成这个项目。

CSS：

.dropdown dt { border-radius: 10px 0px 0px 10px;}

HTML：

        <div class="small-6 medium-3 columns">
          <dl class="dropdown">

            <dt>
            <a href="#0">
              <span title="city" class="hida " ><img src="assets/images/search/placeholder.svg" alt="" style="width:20px; height:20px; margin-right:10px;">Vælg en by</span>
              <p class="multiSel"></p>
            </a>
            </dt>

            <dd>
                <div class="mutliSelect">
                    <ul>
                        <li>
                            <input type="checkbox" value="Thisted" />Thisted</li>
                        <li>
                            <input type="checkbox" value="Snested" />Snested</li>
                        <li>
                            <input type="checkbox" value="Vesløs" />Vesløs</li>
                        <li>
                            <input type="checkbox" value="Nors" />Nors</li>
                        <li>
                            <input type="checkbox" value="Sennels" />Sennels</li>
                        <li>
                            <input type="checkbox" value="Østerild" />Østerild</li>
                    </ul>
                </div>
            </dd>
        </dl>
        </div>

Answer 1

您需要在 a标记上设置边框才能应用边框

因此：

<强>更新

.dropdown dt { 
              height: 20px;
              line-height: 20px;
              display: block;
              background: black;
}


.dropdown dt a {
    padding: 8px 20px 5px 10px;
    overflow: hidden;
    border-radius: 10px 0px 0px 10px;
}

应该有用！

行高将垂直居中文字！

检查此jsfiddle：https://jsfiddle.net/9tgj0n5k/1/

无法在DT上创建border-radius

1 个答案: