css - Inline-block divs fitting 100% width of page if available -

having 2 divs, first image, second text.

both divs have display:inline-block. text div has min-width.

if image width + text min-width fit on page both divs should on same line. otherwise (as in mobile browser) text div should go next line.

this working far, can't make text div use 100% of page width , still right of image div.

what need text div stretch full browser width.

<div style="display:inline-block;vertical-align:top;">     <img src="http://www.acasa.org.br/ensaio/grande/506.jpg" style="xmax-width:500px; width:100%; height:auto;"> </div> <div style="display:inline-block;vertical-align:top;min-width:200px;max-width:500px;background-color:red;"> text here </div> 

use display:block; float:left; instead of display:inline-block;