Make div's height 100% of parent element with other div children with float

I'm trying to create a row of children elements with equal height. However, the children elements contain images of variable height, so the height should be that of the tallest element. Imagine the following:

<div class="parent">
    <div class="child"><img /></div>
    <div class="child"><img /></div>
    <div class="child"><img /></div>
    <div class="child"><img /></div>
</div>

This is the CSS:

.child {float:left;width:25%}

.

I understand this can be done with javascript. However that's out of the question for me (at least I think so) because this is part of an overall responsive design, so the width of the children, while set at 25%, will change with different screen sizes to, say, 50%.

Thanks in advanced!