私の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

がちょうど 位置を追加する必要があり、私はそれを得たいくつかの掘削後に信じて：相対; .logo画像への

Answer 3

垂直アライメントを追加：中間;あなたのlogoimageクラスに：

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