Question

以下代码由标签和文本框组成，我需要将它们放在整个黑色容器中，当窗口大小改变时，它们仍然紧挨着彼此。非常感谢任何想法，谢谢

HTML：

 <div  style="position: relative; width: 100%; min-height: 68px; background-color: #000; border-top: 2px solid white; border-bottom: 2px solid white; overflow: hidden; padding-bottom: 2px" ng-switch on="isLoggedIn">
    <div style="position: relative; float: left; margin-left: 12px;">
            <div class="label" style="vertical-align: middle; color: #fff; margin-top: 8px;">Test</div>
        </div>

        <div style="position: relative; float: left;  margin-left: 12px;">
            <input type="number" class="theInput" min="1" />
            <label class="theLabel"><strong>&nbsp; $ </strong>  &nbsp;  |</label>
        </div>
        <div style="position: relative; float: left; margin-left: 12px;">
            <button type="submit"  ng-disabled="vm.isProcessing"></button>
        </div>
    </div>
</div>

Answer 1

在外部div上试试这个：

<div style="position: relative; left:50%; translate: -50%;">

相对位置应向左移动div，然后翻译将向右调整以完美居中。

关于如何将黑色外部div的元素集中在一起的任何想法？并使他们的大小响应？

1 个答案: