.clearfix still needed?

One last question. The code I inherited has the following:

.clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }
.clearfix {display: inline-block;}
/* Hides from IE-mac \*/
* html .clearfix { height: 1%; }
.clearf开发者_运维技巧ix { display: block; }
/* End hide from IE-mac */

Seems like a lot of hacks. Is this still needed for the modern browsers IE7 and upwards?

---

You don't need to use all that for modern browsers.

Simply using overflow: hidden works and is sufficient in 99% of cases.

See this relevant question that discusses this in depth:

• Is clearfix deprecated?

---

A pretty simple cross-browser method that has always worked for me is placing this below any floated content:

<div style="clear: both;">&nbsp;</div>

Or you can use class="clear" if you want to be neater.

Having the space there isn't always necessary but there are cases when it is.

---

I still use it simply because I'd rather have class="clear" vs overflow: auto or hidden on all my elements.