Question

似乎能够移动图像，我需要并排显示图像和文本，但我希望能够将图像移动一点点，以便中间部分或图像与文本对齐。现在它是底部，无论我做什么它不会向上或向下移动，这里是div的html然后css

  <div class="img">
    <img src="/image/file/location">
    <div class="imgwording">
        <img src="/image/file/location" class="logoimage">
        Test Text
    </div>
    <div class="sub">
        <img src="/image/file/location" class="mail">
        Test Text
    </div>
    <div class="imagelinks1">
        Training &amp;</br>Events
    </div>
    <div class="imagelinks2">
        Trauma &amp; Gender</br>Projects
    </div>
    <div class="imagelinks3">
        Behavioral Health</br>Resources
    </div>
</div>

CSS：

  .imgwording { 
   text-decoration: none !important;
   line-height: 1.28; 
   letter-spacing: 1.5px; 
   text-align: center; 
   font-size: 48px;
   padding: 0px 60px !important;
   position: absolute; 
   top: 65px;
   width: 100%;
   font-family: eb garamond,serif;
   color: #fff;
   display:flex;
   justify-content:center;
   align-items:center;
   flex-direction:column;
   left: -110px;
   display: inline-block;

 }

 .logoimage {
    width: 50px;
    height: 100px;
 }

Answer 1

根据我的理解，你有一个图像和文字并排，但图像低于应有的。您可以做的是将padding-bottom添加到图像CSS以更改其位置。您想要移动多少像素取决于您希望图像移动多少。

基本上做：

.logoimage {
   width: 50px;
   height: 100px;
   padding-bottom: 5px; /* this could be any value depending */
}

Answer 2

相信经过一些挖掘我得到了它，只需要添加位置：相对; 到.logoimage css

Answer 3

添加vertical-align：middle;到你的logoimage类：

.logoimage {
    width: 50px;
    height: 100px;
    vertical-align:middle;
 }

我的css有问题

3 个答案: