html - 文本对齐图像不工作的CSS

Question

到目前为止，我正在尝试将我的图标与我在 wordpress 中的文本垂直对齐

<div class="media oppsite">
  <div class="media-left pull-right"> <?php query_posts('p=89'); ?><?php while (have_posts()) : the_post(); ?><div style="padding-top:42px;"></div></div>
  <div class="media-body text-right">

    <h2 class="media-headingb" style="text-align:center;"><?php the_title(); ?></h4>



    <?php
    if ( has_post_thumbnail() ) { // check if the post has a Post Thumbnail assigned to it.
        the_post_thumbnail( 'full', array( 'class'  => 'imgtop' ) ); // show featured image
    } 


?><?php the_content(); ?>

            <?php endwhile;?>

    </div>
</div>

不起作用 imgTop 是一个将文本垂直对齐到图像顶部的类，但我不明白为什么它不能正确对齐，这是网站。

http://innovativeapps.dk/

Answer 1

我猜你忘了将图像包含在 media-left 类中。

<div class="media oppsite">
      <div class="media-left pull-right"> <img width="286" height="286" src="http://innovativeapps.dk/wp-content/uploads/2017/05/Icon-1.png" class="imgtop wp-post-image" alt="Icon-1" srcset="http://innovativeapps.dk/wp-content/uploads/2017/05/Icon-1.png 286w, http://innovativeapps.dk/wp-content/uploads/2017/05/Icon-1-150x150.png 150w" sizes="(max-width: 286px) 85vw, 286px"><div style="padding-top:42px;"></div></div>
      <div class="media-body text-right">

        <h2 class="media-headingb" style="text-align:center;">Value First</h2>



        <p>Vi udvikler og udgiver din app helt gratis, tilmed giver vi dig en hel måned til at benytte alle dens funktioner kvit og frit. I denne måned vil du selv opleve en stigning i omsætningen som følge af din nye app.<br>
Skulle appen efter den første måned ikke leve op til dine forventninger, eller er der en anden grund til du ikke ønsker at fortsætte, så sletter vi bare appen igen og du bliver ikke trukket en krone.</p>


        </div>
    </div>