Clearing Footer not working

Question

I'm trying to clear the footer like so:

<div>
    <div class="left">Left</div>
    <div class="right">Right</div>
    <div class="footer clear">Footer</div>
<div>

---

.left {
    background-color: red;
    float: left;
}

.right {
    background-color: blue;
    float: right;
}

.footer {
      background-color: orange;
}

// clear
.clear {
   clear: both;
}

Fiddle here: http://jsfiddle.net/RYYFw/8/

But the footer is not clearing. Does anyone know why?

Answer 1

It's your comment // causing the error. It is not allowed in CSS.

Use /* comment */

Answer 2

If you remove the invalid // comment you'll get your desired result..