Родительский блок CSS с дочерними элементами

У меня есть родительский div, содержащий три div. По сути, это колонны. Мне нужно удалить поле на последнем, но я не могу выбрать нужный селектор HTML:

<div class="productContainer">
    <div class="productBox"></div>
    <div class="productBox"></div>
    <div class="productBox"></div>
 <!--/ productContainer --></div>

Вот код CSS:

.productContainer {
    width: 980px;
    height: 400px;
    display: block;
    float: left;
}

How do you target the third child div of a parent? this should work no?
.productContainer > .productBox {
    width: 320px;
    height: 400px;
    display: block;
    float: left;
    margin: 0 10px 0 0;
}

.produtContainer > .productBox nth:child(3) {
    margin-right: 0;
}