Question

I have an array of floating divs that fit 4 to a row. Their widths and right margins add up to 100%. Their bottom margins, however, are static. CSS below:

.item {
    position: relative;
    float: left;
    height: 200px;
    width: 23%;
    margin-right: 2%;
    margin-bottom: 15px;
    background-color: #ddd;
}

Is there a way to retrieve the value of the right margin and apply it to the bottom margin so they are always consistent?

Here is an example of what I have: http://jsfiddle.net/kVZMU/

Answer 1

Why not use margin-bottom: 2%?

Fiddle: http://jsfiddle.net/kboucher/uVfRL/