固定widthの親要素内の子要素でmin-width指定

固定widthの親要素内で、子要素のmin-widthを指定してmin-width〜親のwidth内でスケールさせたいのですが、以下のコードだと子要素がmin-widthを無視して親要素と同じ幅になってしまいます。
どなたか解決策をご存知の方いらっしゃいましたら、ご教示ください。

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

.parent {
    width: 500px;
}
.child {
    min-width: 300px;
    max-width: 500px;
}