Aside div 徘徊在页面底部而不是右侧答案

【问题标题】：Aside div lingers at the bottom of the page instead of the rightAside div 徘徊在页面底部而不是右侧
【发布时间】：2018-08-18 01:10:24
【问题描述】：

我的目标是创建一个表单，您可以在其中输入内容并单击添加，然后它会出现在右侧的框中。

我在一个部分中创建了一个表单，在旁边创建了一个框。我已经按照我认为正确的方式设置了它们的样式，但是旁边总是在表格的末尾下方。表格上的越多，旁边就越低。我希望它始终位于顶部的右侧。

我不知道我做错了什么。我创建了一个重新创建问题的堆栈闪电战：https://stackblitz.com/edit/angular-wjwsj8。

我的样式.css：

aside {
  border: 1px solid #6495ED;
  float: right;
  margin-top: 0px;
  width: 200px;
}

我的 HTML 模板：

<h3>Toppings</h3>
<section>
  <label>Pizza Topping
    <input [(ngModel)]="currentTopping" placeholder="Pizza Topping">
  </label>
  <button mat-raised-button (click)="onAddClick()">Add</button>
  <p class="error">{{message}}&nbsp;</p>
  <button mat-raised-button (click)="onApplyClick()">Apply</button>
</section>

<aside>
  <p *ngFor="let aTopping of settingsService.toppings">{{aTopping}}</p>
  <p *ngFor="let aTopping of settingsService.newToppings" class="ghostText">{{aTopping}}</p>
</aside>

【问题讨论】：

第 {float: left;}
您几乎没有进行任何研究。或者，如果你研究过它，你忘了提及它。您可能会争辩说您阅读了float 的定义，但您似乎没有看过简单的使用示例。请查看this question 接受的答案。鉴于它不太可能帮助其他任何人，我建议将其删除。
@AndreiGheorghiu 我研究过。我去了几个网站，包括阅读 www.w3schools.com 上的所有信息。我不知道如何对“我的一个 div 一直在另一个 div 下结束”进行体面的搜索。我问了几个同事，但他们没有比我更多的经验，所以我在这里发布。为什么不太可能帮助别人？如果有人已经发布了这个问题的答案，我就不会了。

标签： html css angular

【解决方案1】：

感谢@Ylama。我加了

section {float: left;}

我的风格，这解决了问题。我知道这一定很简单，但我想不通。

【讨论】：