Aşağıdaki gibi bir projem var. Sayfa mobil uyumlu olmayacak fakat bunu en kısa yapma yolu bootstrap galiba, bunu nasıl yapabilirim? Bootstrap mantığını vs.. biliyorum bir kaç arkadaş grid/flexbox dedi fakat yapamadım.
Şöyle bir şey yapmayı denedim fakat olmadı:
<div class="container">
<!-- Stack the columns on mobile by making one full-width and the other half-width -->
<div class="row">
<div class="yemek col-md-8"><img src="kebap.png"><p id="yemekismi">Adana Kebap</p></div>
<div class="yemek col-6 col-md-4"><img src="bici.png" ><p id="yemekismi">Bici Bici</p></div>
</div>
<!-- Columns start at 50% wide on mobile and bump up to 33.3% wide on desktop -->
<div class="row">
<div class="yemek col-6 col-md-4"><img src="salgam.png"><p id="yemekismi">Şalgam</p></div>
<div class="yemek col-6 col-md-4"><img src="sarma.png"><p id="yemekismi">Dolma & Sarma</p></div>
<div class="yemek col-6 col-md-4"><img src="sirdan.png"><p id="yemekismi">Şırdan</p></div>
</div>
<!-- Columns are always 50% wide, on mobile and desktop -->
<div class="row">
<div class="yemek col-6"><img src="halka.png"><p id="yemekismi">Halka Tatlı</p></div>
</div>
</div>