<div class="row">
<div class="col-sm-4">
<h3 class="heading-h3 p1-h3">Modern Standard</h3>
<p class="p1">
Sometimes copy and pasting some jQuery plugins doesn't cut it. I can help create truly bespoke solutions based on requirements
</p>
</div>
<div class="col-sm-2">
<i class="ion-social-html5"></i>
</div>
<div class="col-sm-2">
<i class="ion-social-html5"></i>
</div>
<div class="col-sm-4">
<h3 class="heading-h3 p2-h3">Responsive Design experience</h3>
<p class="p2">
By using bootstrap I ensure most projects work cross device out of the box
</p>
</div>
<div class="col-sm-4">
<h3 class="heading-h3 p3-h3">Available full time</h3>
<p class="p3">
This is my main job, so i'm available 9-5 on phone/email/Skype.
</p>
</div>
<div class="col-sm-2">
<i class="ion-social-html5"></i>
</div>
<div class="col-sm-2">
<i class="ion-social-html5"></i>
</div>
<div class="col-sm-4">
<h3 class="heading-h3 p4-h3">Reliable and trusted by clients</h3>
<p class="p4">
Whilst some freelancers go AWOL when the going gets tough, i've worked with few clients for time now
</p>
</div>
<div class="col-md-4">
<h3 class="heading-h3 p5-h3">Built with Scalability</h3>
<p class="p5">
I can help advise the best methodology to ensure your project grows with you.
</p>
</div>
<div class="col-sm-2">
<i class="ion-social-html5"></i>
</div>
<div class="col-sm-2">
<i class="ion-social-html5"></i>
</div>
<div class="col-md-4">
<h3 class="heading-h3 p6-h3">5-star Support</h3>
<p class="p6">
Sometimes building the site is half the work, i'm always around to provide ongoing support.
</p>
</div>
</div>
</div>
</div>
我一直试图让两列col-sm-4和col-sm-2并排站立。使用媒体查询在小型设备上使用内容和图标站在旁边，并使用Bootstrap 4，我只是无法让它响应。
答案 0 :(得分：0)
答案 1 :(得分：0)
将列彼此相邻是有效的。但是你应该不时地开始新的一行。
<link href="http://code.ionicframework.com/ionicons/2.0.1/css/ionicons.min.css" rel="stylesheet"/>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet"/>
<div class="row">
<div class="col-sm-4">
<h3 class="heading-h3 p1-h3">Modern Standard</h3>
<p class="p1">
Sometimes copy and pasting some jQuery plugins doesn't cut it. I can help create truly bespoke solutions based on requirements
</p>
</div>
<div class="col-sm-2">
<i class="ion-social-html5"></i>
</div>
</div>
<div class="row">
<div class="col-sm-2">
<i class="ion-social-html5"></i>
</div>
<div class="col-sm-4">
<h3 class="heading-h3 p2-h3">Responsive Design experience</h3>
<p class="p2">
By using bootstrap I ensure most projects work cross device out of the box
</p>
</div>
</div>
<div class="row">
<div class="col-sm-4">
<h3 class="heading-h3 p3-h3">Available full time</h3>
<p class="p3">
This is my main job, so i'm available 9-5 on phone/email/Skype.
</p>
</div>
<div class="col-sm-2">
<i class="ion-social-html5"></i>
</div>
<div class="col-sm-2">
<i class="ion-social-html5"></i>
</div>
</div>
<div class="row">
<div class="col-sm-4">
<h3 class="heading-h3 p4-h3">Reliable and trusted by clients</h3>
<p class="p4">
Whilst some freelancers go AWOL when the going gets tough, i've worked with few clients for time now
</p>
</div>
</div>
<div class="row">
<div class="col-md-4">
<h3 class="heading-h3 p5-h3">Built with Scalability</h3>
<p class="p5">
I can help advise the best methodology to ensure your project grows with you.
</p>
</div>
<div class="col-sm-2">
<i class="ion-social-html5"></i>
</div>
</div>
<div class="row">
<div class="col-sm-2">
<i class="ion-social-html5"></i>
</div>
<div class="col-md-4">
<h3 class="heading-h3 p6-h3">5-star Support</h3>
<p class="p6">
Sometimes building the site is half the work, i'm always around to provide ongoing support.
</p>
</div>
</div>