Image我想在标题下方的两列显示页面,并按照其方式对齐按钮。将页面划分为两列,并将它们对齐为HTML
我不明白我是否在这里错过任何divs?
我一直在尝试这样做,但它没有显示出我期望的样子。
<div>
<div class="slds-p-top--x-large slds-text-align--center slds-p-bottom_small" width="100%">
<span>Help us improve Customer Support</span>
</div>
<table>
<tr>
<td width="50%" class="divText slds-p-bottom--medium leftBtn" >Tell us what you think<br/>
<div class="slds-text-align--center slds-p-top--small slds-p-bottom--large slds-p-top--medium">
<button class="slds-button slds-button--neutral">
<span class="btn-feedback">Provide feedback</span>
</button>
</div>
</td>
<td width="50%" class="vertical-liness divText slds-p-bottom--medium rightBtn" >Collaborate with our team<br/>
<div class="slds-text-align--center slds-p-top--small slds-p-bottom--large slds-p-top--medium">
<button class="slds-button slds-button--neutral">
<span class="btn-feedback">Get Involved</span>
</button>
</div>
</td>
</tr>
</table>
</div>
.THIS .vertical-liness
{
border-left: 2px solid red;
}
.THIS .leftBtn{
padding-left:115px;
float:right;
}
.THIS .rightBtn{
padding-left:175px;
}
.THIS {
background-color: #f4f7f7; /* ibm-cool-white-3; */
border-top: 1px solid #d0dada; /* ibm-gray-10 */
font-size: 20px;
font-weight: normal;
color: #272727; /* ibm-gray-90 */
}
.THIS .divText{
font-size: 16px;
color: #272727; /* ibm-gray-90 */
}
张贴你试图解决问题的完整的HTML和CSS。看看如何创建[mcve] –
有没有** CSS **方法来对齐不共享父项的元素。 –
@Michael Coker,我添加了完整的HTML和图像 – user5495947