htmlの 'case'画像の上部を移動するには

Question

これはコードです：https://codepen.io/vendettashakur/pen/rmLYBN ケース上部を使って画像を移動するにはどうすればいいですか？

body { 
 
     background: #333; 
 
    } 
 
.wrapper { 
 
     padding: -10px; 
 
    margin: 10px; 
 
    margin-right: 900px; 
 
    text-align: center; 
 
} 
 
.treasure { 
 
     color: #fff; 
 
     display: inline-block; 
 
     max-width: 400px; 
 
     text-align: center; 
 
     padding: 70px; 
 
     margin: 20px; 
 
     font-size: 25px; 
 
     font-weight: bold; 
 
    } 
 
.block { 
 
     padding: 4px; 
 
     background: #7c4dff;; 
 
     border-radius: 2px; 
 
     margin-left: 4px; 
 
    } 
 

 
.subcase { 
 
     
 
     color: white; 
 
     display: inline-block; 
 
     max-width: 2000px; 
 
     text-align: center; 
 
     font-size: 15px; 
 
     font-weight: bold; 
 
     padding: -20px; 
 
     margin: -76px; 
 
     vertical-align: text-top; 
 
    } 
 
.treasureimage { 
 
     
 
     display: inline-block; 
 
     max-width: 2000px; 
 
     padding: 10px; 
 
     vertical-align: text-top; 
 
     
 
    
 
    }

<div class="wrapper"> 
 
    <p class="treasure"> 
 
     Treasure Chest 
 
     <span class="block"> 
 
      $1 
 
     </span></p> 
 
    <br> 
 
    <p class="subcase"> 
 
     10% chance of getting a top-grade game</p> 
 
    <br> 
 
    <img class="treasureimage"> 
 
     <img src="https://gamedrop.win/img/cases/case_blue.png" alt="case" style="width:200px;height:128px"> </img>

イメージが完全に見栄えするように配置する必要があります。それで全部です。私はパディング、マージンなどで試してみて、何も私のために働く。

Answer 1

あなたは画像、テキスト、「宝箱」の後に移動させることが期待されている場合は、あなたのhtmlで、私は、テキストの下にそれをしたい最初<p>タグ