我在列上设置边框时遇到问题。文本正在改变div的大小,因此边框会发生变化。我试图设置固定大小的div,但它并不好。我不确定为什么边界会移动。是填充吗?我是初学者,很难让我做到正确。锄头要固定,不要越过下一个div?
这是HTML:
<div class="container full-width margin-bottom-x">
<div class="row">
<div class="col-xs-12 col-sm-6 fund-text">
<div class="col-xs-12 col-sm-12 no-padding">
<div class="pull-left" style="margin-left: 0px;">
<img src="http://mezet.xyz/romeda/wp-content/uploads/2017/09/funds-projects-01.png" alt="Fund project" />
</div>
</div>
<p>Russia’s leading auto leasing company. Fully exited in 2015.</p>
<button type="button" class="btn btn-funds">More details</button>
</div>
<div class="col-xs-12 col-sm-6 fund-text">
<div class="col-xs-12 col-sm-12 no-padding">
<div class="pull-left" style="margin-left: 0px;">
<img src="http://mezet.xyz/romeda/wp-content/uploads/2017/09/fund-projects-02.png" alt="Fund project" />
</div>
</div>
<p>Russia’s largest Internet company and leading
search engine.</p>
<button type="button" class="btn btn-funds">More details</button>
</div>
</div>
<div class="row">
<div class="col-xs-12 col-sm-6 fund-text">
<div class="col-xs-12 col-sm-12 no-padding">
<div class="pull-left" style="margin-left:0px;">
<img src="http://mezet.xyz/romeda/wp-content/uploads/2017/09/fund-projects-03.png" alt="Fund project" />
</div>
</div>
<p>The leading e-commerce platform in Russia and the CIS.</p>
<button type="button" class="btn btn-funds">More details</button>
</div>
<div class="col-xs-12 col-sm-6 fund-text">
<div class="col-xs-12 col-sm-12 no-padding">
<div class="pull-left" style="margin-left:0px;">
<img src="http://mezet.xyz/romeda/wp-content/uploads/2017/09/fund-projects-04.png" alt="Fund project" />
</div>
</div>
<p>Independent oil and gas company.</p>
<button type="button" class="btn btn-funds">More details</button>
</div>
</div>
</div>
和CSS:
.fund-views{
font-family: Roboto;
background-color: #EFEFEF;
color: #000000;
text-align: center;
}
.fund-views .fund-text {
padding: 90px;
padding-left: 160px;
border: 1px solid #cccccc;
}
.fund-views .fund-text p{
font-size: 20px;
font-weight: 100;
text-align:left;
}