左侧浮动或者绝对定位，右侧通过margin撑开
使用flex
使用<div>包含，然后靠margin形成bfc（百科：block formatting context块级格式化上下文
bfc是一个独立的渲染区域，只有block-level box参与，他规定了包括内部的block-level box如何布局，并且与这个区域外部毫不相干。
bfc就是页面上的一个隔离的独立容器，容器里面的子元素不会影响到外面的元素，反之也是如此，包括浮动和外边距合并等等，有了这些特性我们布局的时候就不会出现意外了情况了。
- 哪些情况下会产生bfc
display属性为block，list-item，table的元素，会产生bfc。（最常用的就是块级元素）
- 什么情况下会触发bfc
设置了float属性，并且不为none
position属性为absolute或者fixed（fixed：固定布局）
display为inline-block，table-cell，table-caption，flex，inline-flex
overflow属性不为visible
）