html - 如何改变标签的高度

Question

我有一点愚蠢的错误。我目前有以下内容:

我想让标签(黄色部分)与文本区域的高度相同。这是我的 CSS:

.labelbox{
            border-bottom-left-radius:2em;
            border-top-left-radius: 2em;
            padding: 8px;
            display: block;
            border: 1px solid #d4d4d4;
            background: #e9f939; /* Old browsers */
            padding-right: 5px;
            color:black;
            float:left;
            width:17.5%;
        } 

.inputbox{
            width: 80%;
            border: 1px solid #d4d4d4;
            border-bottom-right-radius: 2em;
            border-top-right-radius: 2em;
            box-shadow: inset 0px 2px 2px #ececec;
            display: inline;
            padding: 8px;
            font-size: 100%;
            margin-top: 0px;
            margin-bottom: 1%;
        }

HTML:

 <label class="labelbox" style="display:inline-block" for="textareacontactus">Type Message</label>
 <textarea maxlength="1000" class="inputbox" rows="6" style="resize: none;height" ng-model="textareacontactus" ng-minlength="20" name="textareacontactus" id="textareacontactus" data-role="none"></textarea required>

现在在我的 HTML 中我使用了 style="height:20%" 但似乎什么都没有改变，我也不知道为什么。有什么想法吗？

Answer 1

为您提供修复解决方案:Demo

只需将 line-height:6em; 添加到 .labelbox 即可。