html - 对齐在同一行

Question

如何将下图和框对齐在同一行？左边的图片和右边的框，它们之间有一些空间。

<div id="slideshow" >
    <div id="changeimage">
       <img class="image" src="bafdf1f214f5a800c95ef301234c254a.iix"/>
    </div>

    <div id="newsbox">
        <span class="label label-danger">Latest News</span>
        <div class="group-box">
            <div class="grey-group">    
                <span>Notes:This is a box</span>                
            </div>
        </div> 
    </div>
</div>

Answer 1

就像@ntgCleaner 所说:“有大约 20 种方法可以给那只猫剥皮。”

这可能是实现这一目标的一种方式:

#slideshow {
  display: flex;
}

.group-box {
  margin-top: 50px; 
}

<div id="slideshow" >
 <div id="changeimage">
   <img class="image" src="//thumb7.shutterstock.com/display_pic_with_logo/260389/347420135/stock-photo-top-view-of-architect-drawing-on-architectural-project-347420135.jpg"/>
  </div>

 <div id="newsbox"><span class="label label-danger">Latest News</span>
   <div class="group-box">
       <div class="grey-group">   
          <span>Notes:This is a box</span>                
       </div>
   </div> 
 </div>
</div>