I am relatively new to CSS and came across an issue with Skeleton when resizing the browser window. I have an image and text displayed next to each other in columns, as shown below (although there is much more text in reality). Everything looks fine initially, but as I make the browser narrower, the text starts overlapping the image for a significant distance before suddenly dropping below the image once the browser width becomes very narrow.
I believe there may be a solution to this problem using the Skeleton CSS Utilities, but my current knowledge of CSS is quite limited and I haven't been able to figure it out on my own.
<div class="row">
<div class="one-third column">
<img src="images/myimage.jpg">
</div>
<div class="two-thirds column">
Lots of placeholder text can go here.
</div>
</div>