如何使用引导程序将某些文本右对齐和图像下方的一些文本对齐

如何解决如何使用引导程序将某些文本右对齐和图像下方的一些文本对齐

我正在尝试使用Bootstrap进行此操作，到目前为止，我已经能够通过d-inline类将Marketplace放在徽标旁边。

我的问题是市场和徽标没有垂直对齐，并且下面的文本对齐得不太好，它看起来像是一段有很多中断的段落。如何实现图像上显示的效果？

.marketplace {
        background-color: #5960CB;
        width: 100%;
        height: 50%;
        list-style-type: none;
    }
 .containerMarket p {
        color: white;
        font-family: 'Poppins',sans-serif;
        margin-left: 5px;
        margin-top: 10px;
    }

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">
<div class="marketplace col-sm-12">
        <div class="container containerMarket col-sm-4">
            <img src="img/fullLogoWhite.png" width="150" class="d-inline"> <p class="d-inline">Marketplace</p>
            <p>High quality items created by our global community.</p>
            <p><span>65,478</span> Products | <span>65,478</span> Members | <span>65,478</span> Vendors</p>
        </div>

谢谢！

解决方法

您必须使用Bootstrap垂直对齐方式：

  <td class="align-baseline">baseline</td>

Documentation

,

.marketplace {
        background-color: #5960CB;
        width: 100%;
        height: 50%;
        list-style-type: none;
    }
 .containerMarket p {
        color: white;
        font-family: 'Poppins',sans-serif;
        margin-left: 5px;
        margin-top: 10px;
        margin-bottom: 10px;        
    }

<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.5.2/css/bootstrap.min.css" integrity="sha384-JcKb8q3iqJ61gNV9KGb8thSsNjpSL0n8PARn9HuZOnIxN0hoP+VmmDGMN5t9UJ0Z" crossorigin="anonymous">
<div class="marketplace col-sm-12">
        <div class="container containerMarket">
        <div class="d-flex align-items-center">
            <img src="img/fullLogoWhite.png" width="150" class="d-inline"> 
            <p class="d-inline">Marketplace</p>
        </div>

<p class="small">High quality items created by our global community.</p>
            <p class="small"><span>65,478</span> Products | <span>65,478</span> Members | <span>65,478</span> Vendors</p>
        </div>