响应式网站布局-栏目

Question

First image Second image

在第一张图片中，右栏应该是这样的，但在767px(第二张图片)时，我希望它在左栏下面，并且是100%宽。但是，它是从顶层开始的，而不是从“技术技能”标题开始。我该如何解决这个问题？

.left-column,
.right-column{
    display: block;
    float: left;
    margin: 1% 0 1% 1.6%;
}
.left-column,
.right-column{
    width: 49.2%;
}
.left-column{
    margin-left: 0;
}
.row {
    zoom: 1; 
}
.row:before,
.row:after {
    content:"";
    display:table;
}
.row:after {
    clear:both;
}

@media only screen and (max-width: 767px){

.left-column,
.right-column{
    width: 100%;
}

.right-column{
    float: none;
}