Tabletlere ve bazı bilgisayarlara göre responsive tasarım nasıl yaplır
Arkadaşlar merhaba. Şimdi ben yaptığım siteyi reponsive olarak ayarlamaya çalışıyorum. Mesela kendi laptop'ıma göre tasarımı ayarlıyorum ve "min-width:1200px" veriyorum. Tabletlerin bazıları düzgün görünüyor, bazıları ise dağınık. Ama aynı tableti yan yatırdığımızda görüntü bozuluyor. Mesela ipad pro 10, nexus 10 da görüntü bozuluyor. Aynı şekilde bilgisayar için "1200px" veriyorum ama onlarda da aynı. Nasıl bir ayarlama yapmak lazım acaba.
Arkadaşlar hizalama işlemlerini hallettim. Tek problemim resimde görüldüğü gibi "footer" ın altındaki büyük boşluklar. Genelde dikeyde çok çıkıyor bu boşluk. 100px; 200px; gibi. Mesela alttaki resim "ipad width:1024px"
https://hizliresim.com/JxsjFh
@media screen and (min-width: 992px) and (max-width: 1199px) {
.videomediaquery {
width:32.5%;
height:165px;
float:left;
margin-left:1.1%;
}
}
@media screen and (min-width: 992px) and (max-width: 1199px) {
.videomediaquery:first-child {
width:32.5%;
height:165px;
float:left;
margin-left:0%;
}
}