切图——float

最近在切图，问题真是多。

float

假设父元素中所有的子元素都float了，那么父元素就会失去height，那么这个时候就需要清除浮动了。
声明一下：这种方法不考虑IE那个货。。。

很简单的方法就是给父元素加上

overflow: hidden;

• 纳尼！如此就好？
  yes！
• 那么你怎么还不会！
  咳咳，我把overflow加到了浮动元素上，所以在使用开发者工具来查看元素的时候，父元素一直没有高度…唉～

---

why float

• 为什么要使用float？
  在使用float之前，我排除了table，选择div这里是一片日历——没错，全部都是div。以前没这么做过。我不是很想用float，所以就使用了display:inline-block;但是这里出现了一个问题，那就是div之间有间隔不止 3px！

• 什么情况？你怎么解决的？
  我也不知道，一开始以为是margin，padding的问题，加了css

margin:0;padding:0;

但是没有效果，这好奇怪。

• 接着呢？
  接着我去查了，是因为我的div们是这样写的

<div></div>
<div></div>
<div></div>
…

解决办法是这样写

<div></div><div></div><div></div>

更多好方法参见网上转载文章
http://www.w3cplus.com/css/inline-blocks.html
我最后选择float。

---

如何发现清除浮动不顶用

• 这个标题是啥意思啊？
  首先这个标题所要表达的意思是overflow写错地方的场景下。
  我写的那个部分需要设置margin-bottom但是一直没能得到想要的效果。就这样发现了原来是父元素没有高度。
• 那你所用的工具呢？
  chrome浏览器自带的开发者工具，足够了。