我是 CSS 初學(xué)者。在 JSP 頁面中，我有兩個位于彼此之下的 div。每個 div 都帶有一個字段、按鈕和一個表格。我需要將字段、表格和按鈕放置在彼此旁邊，而不是放在彼此下面。下面是我的 2 個 div 的 JSP。如何實現(xiàn)我想要的？第一個分區(qū)： <div class="panel panel-default"> <div class="panel-heading"><b><spring:message code="supportive.criterea.section.label"/></b></div> <div class="panel-body "> <div class="form-group col-lg-3 col-xs-12 float2"> <c:forEach items="${serviceFields}" var="serviceField"> <c:if test="${serviceField.columnName == 'v38'}"> <label for="criterea"> <c:choose> <c:when test="${i18n.language == 'en' }">${serviceField.labelEn}</c:when> <c:otherwise>${serviceField.labelAr}</c:otherwise> </c:choose> <c:if test="${serviceField.isRequired == 1}"> <span class="required"> </span> </label> <input type="text" value="${requestDetails.v38}" class="form-control input-sm <c:if test="${serviceField.isRequired == 1 && step.isStart == 1}"> mandatory</c:if>" name="v38" id="criterea" <c:if test="${step != null && step.isStart != 1}"> disabled</c:if> /> </c:if> </c:forEach> </div>
2 回答
胡子哥哥
TA貢獻(xiàn)1825條經(jīng)驗 獲得超6個贊
創(chuàng)建一個容器 div，您的兩個 div 都位于其中。這個 div 必須是display:flexand flex-direction:row：
<div style="display:flex; flex-direction:row">
<div id="firstdiv"></div>
<div id="seconddiv"></div>
</div>
另一種解決方案是添加display:inline-block到您的兩個 div 中
溫溫醬
TA貢獻(xiàn)1752條經(jīng)驗 獲得超4個贊
<div class="d-flex">
<div class="innerDiv"></div>
<div class="innerDiv"></div>
</div>
<style>
.d-flex {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
-ms-flex-wrap: wrap;
flex-wrap: wrap;
margin-right: -15px;
margin-left: -15px;
}`
.innerDiv {
padding-left: 15px;
padding-right:15px;
}
</style>
- 2 回答
- 0 關(guān)注
- 151 瀏覽
添加回答
舉報
0/150
提交
取消