css - Responsive div - text wrapping div. Can this be stacked when minimized? -

i have set global element align images right:

.containerright {     float: right; margin: 5px 5px 5px 10px; position:relative; } 

it works until screen minimized mobile portrait size. text wrap leaves few words behind.

for example:

<div class="containerright"><img src="/images/imageexample.jpg" width="223" height="160" hspace="0" vspace="5" alt="imageexample" border="0"></div>  <h2>here example of heading text!</h2> 

when minimised 'here example...' aligned top-left of image , rest of sentence '...of heading text!' falls under image there huge break image sitting right.

how can set class when it's viewed '@media (max-width: 320px)' stacks eg. display:block; ???

thanks help!

just remove float in media query css. :)

@media (max-width: 320px) { .containerright {     float: right; /* remove float on mobile media query */     margin: 5px 5px 5px 10px;      position:relative; } } 

jsfiddle example here.. resize screen see on mobile < 320px.

alternatively, override in media query..

@media (max-width: 320px) { .containerright {     float:none; } }