html - 3列から2列。複数行

Question

だから私が抱えている問題は、3列の複数の行があることです。でも; コンテンツの幅を小さくしたい場合は、2 列に落としてください。どのように？

また、各列には画像の背景が含まれていることにも言及する必要があります。これについて私が見たすべての解決策は、3 番目の列の項目を 100% 幅にすることですが、画像ではそれを行うことはできません。CSSとHTMLだけでも可能ですか？

何か案は？

前もって感謝します。

編集

 <div class="media-row clearfix first">
        <div class="g6 first">
            Column 1
        </div>
        <div class="g6">
            Column 2
        </div>
        <div class="g6 last">
            Column 3
        </div>
    </div>

<div class="media-row clearfix last">
    <div class="g6 first">
        Column 1
    </div>
    <div class="g6">
        Column 2
    </div>
    <div class="g6 last">
        Column 3
    </div>
</div>

.media-row { margin-bottom: 20px; }
div.g6 { float: left; margin-left: 1.76%; min-height: 20px; overflow: hidden; }
div.g6:first-child { margin-left: 0 }
div.g6 { width: 27.91%; }