我目前正在开发一个需要对移动设备做出响应的网页。我已经链接了两张它现在的样子的图片，一张是普通设计的，另一张是它现在在手机上的样子。我想改变的是彩色填充物，但我不知道。正如你所看到的，在上面的图标和下面的图像之间有一个空格，我想去掉这个空白，要么用相同的颜色填充，要么做填充物来掩盖它。当然，我希望电脑屏幕的版本保持它在图像上的样子。有人知道解决这个问题的办法吗？
手机图像：https://i.stack.imgur.com/2pWMc.jpg
Web图像：https://i.stack.imgur.com/TH8ch.jpg
这是我所说的区块的代码，很抱歉之前没有包含。
<div class="col-md-4"
style=" width: 365px; background-color: #D7E1F8; padding-bottom: 141px; padding-left: 100px;">
<h1 class="icontextlb"> <br><br><br>
<i class="icon-email iconstylelb"></i>
<br>
2014
</h1>
</div>
<div class="col-md-4" style="background-color: #D7E1F8; padding-bottom: 65px;">
<br><br><br><img src="images/verhaal/kraan.png"/>
</div>
<div class="col-md-4" style="background-color: #D7E1F8; padding-bottom: 248.8px; padding-top: 20px;">
<h1><br>
Koppeling met web en de fabriek
</h1>
<p>
In 2014 was de koppeling met de website en de
fabriek klaar. Dit betekend dat de orders
automatisch verstuurd worden naar de fabriek. De
orders worden hierdoor sneller doorgevoerd en de
klant heeft eerder zijn glas op maat.
</p>
</div>正如你所看到的，我在这里有3个不同的填充，用于图像、图标和文本。我认为，如果只是一点填充或背景色，而不是需要调整的三个独立部分，会更容易。
填充实际上不是这里的问题。空白的问题是因为您在第一个col-md-4上使用了固定的宽度。Bootstrap本身已经有响应，所以设置固定的宽度对它没有任何帮助。col-md-4已经具有与宽度相关联的宽度md-4。我建议删除固定宽度，让它恢复到默认的width: 100%;，这样它就可以使用所有的列宽。
旁注：虽然br元素很棒，但Bootstrap列的设计是将每个div分割成多个部分，因此额外的br和padding有点不必要，尤其是在使用Bootstrap框架时。最后，我添加了一个container和row作为良好的度量，它似乎是基于您的web图像您已经在使用一行。
<head>
<link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-EVSTQN3/azprG1Anm3QDgpJLIm9Nao0Yz1ztcQTwFspd3yD65VohhpuuCOmLASjC" crossorigin="anonymous">
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.2/dist/js/bootstrap.bundle.min.js" integrity="sha384-MrcW6ZMFYlzcLA8Nl+NtUVF0sA7MsXsP1UyJoMp4YLEuNSfAP+JcXn/tWtIaxVXM" crossorigin="anonymous"></script>
</head>
<div class="container">
<div class="row">
<div class="col-md-4"
style="background-color: #D7E1F8; padding-bottom: 141px; padding-left: 100px;">
<h1 class="icontextlb"> <br><br><br>
<i class="icon-email iconstylelb"></i>
<br>
2014
</h1>
</div>
<div class="col-md-4" style="background-color: #D7E1F8; padding-bottom: 65px;">
<br><br><br><img src="https://dummyimage.com/400x400/000/fff"/>
</div>
<div class="col-md-4" style="background-color: #D7E1F8; padding-bottom: 248.8px; padding-top: 20px;">
<h1><br>
Koppeling met web en de fabriek
</h1>
<p>
In 2014 was de koppeling met de website en de
fabriek klaar. Dit betekend dat de orders
automatisch verstuurd worden naar de fabriek. De
orders worden hierdoor sneller doorgevoerd en de
klant heeft eerder zijn glas op maat.
</p>
</div>
</div>
</div>