如何将图像与右侧的段落对齐答案

【问题标题】：How to align a image to a paragraph to the right如何将图像与右侧的段落对齐
【发布时间】：2020-02-25 05:28:27
【问题描述】：

    [scrollspy samp[scrollspy][1]le]

现在已经删除了 about us 部分中的填充，scrollspy 未与 about us 对齐，我需要有关如何修复 scollspy 同时保持图片与段落对齐的帮助。

</style>
      </head>
      <body id="#navbar" data-spy="scroll" data-target="navbar" data-offset="10">
          <nav id="#navbar" class="navbar navbar-expand-sm navbar-light bg-light fixed-top">
              <a href="#" class="navbar-brand">
                <img src="logo.png" alt="Logo" style="width:80px;">
              <div class="collapse navbar-collapse">
                  <ul class="navbar-nav ml-auto">
                    <li class="navbar-nav">
                      <a class="nav-link" href="#About Us">About Us</a>
                    </li>
                    <li class="nav-item">
                        <a href="#Services" class="nav-link">Services</a>
                      </li>    
                      <li class="nav-item">
                          <a href="#Porfolio" class="nav-link">Porfolio</a>
                        </li> 
                        <li class="nav-item">
                            <a href="#Contact Us" class="nav-link">Contact Us</a>
                          </li> 


                  </ul>  

                </div>

【问题讨论】：

您还可以调查Flexbox，这将允许您将div 和img 并排显示为列
你能提供一个完整的sn-p，所有div class="container-fluid"（你缺少2个关闭div标签）

标签： html css image bootstrap-4 alignment

【解决方案1】：

从“关于我们”div 中删除 padding-top:85px 样式属性 - 这会创建一个 85 像素高的空白区域，这显然是您不想要的。

此外，其中的h2 将有一个相对较高的默认top-margin，这也会在文本上方创建空白，因此您可能需要将margin-top: 0 添加到该h2。

【讨论】：

谢谢，当我按照您的建议删除填充时，它会对齐照片，但是当我点击导航上的关于我们时，它会在向下滚动时剪切信息。另外我会在哪里添加margin-top：0，作为代码？谢谢
您提供的代码中没有导航，所以我无法帮助您。关于margin: 0：这将被添加到h2 元素的CSS 中（其中包含“关于我们”标题）
好的，我已经添加了图片示例，请参见上文。还有更新的代码。谢谢！
您用新代码完全替换了问题中的先前代码-我认为您应该创建一个新问题（并且更具体-没有“图片示例”，您可能应该添加解释什么是“scollspy”——你不能指望人们开始搜索和研究你使用的术语......