Create a two column layout with skeleton framework? - skeleton-css-boilerplate

Question

I am new to Skeleton framework and am trying to build a two column layout for a blog project. So far this is what I have:
<section class="list-posts">
<div class="container">
<div class="row">
<div class="nine columns posts">
[NINE COLUMNS]
</div><!--nine columns-->
<div class="three columns aside">
[ASIDE]
[/ASIDE]
</div>
</div><!--row-->
</div>
but as more columns are added to the .posts class the aside collapses. Your help will be appreciated.

Answer 1

Not sure if I understand your problem, but if you are trying to nest columns you need to put a row div within the nine columns, and end the row(s) for every twelve columns.
If this is not the case, could you please provide a more specific clarification of your problem with a link or image.

Answer 2

Well after waiting for some hours without getting any help, i decided to get my hands dirty, this is what i did
<section class="content">
<div class="container">
<div class="row">
<!--LIST ALL THE POSTS HERE-->
<div class="twelve columns">
<div class='twelve'>
<div class='row single-entry'>
<div class='six columns'>
...
</div>
<div class='six columns'>
...
</div>
</div><!--row-->
</div><!--twelve-->
</div><!--row-->
<!-- ASIDE-->
<div class="four columns aside border-between">
<div class="row ">
<div class="twelve columns">
<div class="twelve">
<h4 class="standing">Recommendations</h4>
</div>
<div class="twelve columns recommended-articles">
<div class="three columns">
<img src="images/footer.png" class="u-max-full-width">
</div>
<div class="nine columns recommended-articles-details">
<h6 class="article-title">4 top SEO trends for 2017</h6>
<p class="author_name">Joel Orok</p>
</div>
</div>
</div>
</div>
</div>
</section>