我的CSS有麻煩

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

據我了解，您擁有並排的圖像和文本，但是圖像比應有的低。 您可以做的是在圖像CSS上添加padding-bottom來更改其位置。 您要移動多少像素將取決於圖像要移動多少。

基本上在做：

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

Answer 2

相信經過一番挖掘我就明白了，只需要添加位置即可： 到.logoimage CSS

Answer 3

添加vertical-align：middle; 到您的徽標圖像類：

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