HTML/CSS：部分+ Aside Issue

我在我的栏中有一个问题，我的栏杆上有时间戳。HTML/CSS：部分+ Aside Issue

 <section> 
      <div class="thumbnail-title"> 
       Sample 
      </div> 

      <div class="thumbnail-image"></div> 
      <div class="thumbnail-text"> 
       <div class="thumbnail-timestamp"> 
        02-11-2016 18:51 P.M. 
       </div> 
       Hello this is random text that I will test today to see if my sizing is correct. 
       ello this is random text that I will test today to see if my sizing is correct. 
      </div> 
     </section> 

     <aside> 
      Random Aside Text. 
     </aside>

如果我添加更多的部分，旁边的条棒会粘在最后一个部分，因为我希望它从上到下粘住。

另外我的时间戳是好的，如果一个部分存在，但如果添加更多的部分，时间戳get的推送到文本下方。

这里是CSS：

section, 
aside 
{ 
    margin: 20px 20px 24px 0; 
} 

section 
{ 
    float: left; 
    width: 55%; 
    margin-left: 20px; 
    border: 3px solid black; 
    padding-bottom: 20px; 
    border-radius: 10px; 
} 

.thumbnail-title 
{ 
    border: 3px solid black; 
    border-top: none; 
    border-left: none; 
    border-right: none; 
    padding: 15px; 
    text-align: center; 
    font-size: 24px; 
    margin-bottom: 20px; 
} 

.thumbnail-image 
{ 
    float: left; 
    height: 200px; 
    width: 300px; 
    border: 3px solid black; 
    margin-left: 20px; 
    margin-right: 20px; 
    border-radius: 10px; 
} 

.thumbnail-text 
{ 
    font-size: 18px; 
    text-align: left; 
    padding: 20px; 
    padding-left: 20px; 
    margin-left: 20px; 
    margin-right: 20px; 
    border-radius: 10px; 
} 

.thumbnail-timestamp 
{ 
    border: 1px solid black; 
    text-align: right; 
    float: right; 
    width: 360px; 
    height: 10px; 
    padding: 2px; 
    font-size: 10px; 
    margin-bottom: 10px; 
    border-top: none; 
    border-left: none; 
    border-right: none; 
} 

aside 
{ 
    float: right; 
    width: 38%; 
    padding: 10px; 
    border: 3px solid black; 
    border-radius: 10px; 
}

我想我的网页看起来像这样： Idea

来源

2016-12-02 ThatHashCodeGuy