Mobil temada kayma

Question

Merhaba mobil temada ekranı yan döndürünce fotolarda görüldüğü üzere manşet alanından sonra ürünler alanı arasında bayağı bir boşluk oluşuyor. Bunu hangi dosyadan nasıl düzeltebilirim.

Dik konumda normal

Yataya alınca baya bir boşluk oluşuyor.

Dik konumda normal

Yataya alınca baya bir boşluk oluşuyor.

Halil0707 · Accepted Answer

main.css 525. satırdaki şu kısmı bulun:

.content {
 margin: 50px 0 86px 0;
 }şununla değiştirin:

.content {
 margin: 18px 0 86px 0;
}Çerez olmayan bir tarayıcıda kontrol edin. main.css dosyanızı tarayıcıda açın, kodların geçerli olup olmadığını görün. Geçerli ve olmuyor ise !important ile 18px margin'e zorlayın. Kodlar orada görünmüyor ise önbellek temizlemeniz gerekir. SHIFT + F5 ile sayfayı yenilemek genelde çözüm olur.

Aynı sorun footer üzerinde de var. içeriği .content divi içerisine alıp alt ve üst boşluk vermişler. Alttaki boşluğu da kaldırmak isterseniz 
.content {
 margin: 5px 0 5px 0;
}böyle güncelleyebilirsiniz.

brown · Answer

css dosyanızın en altına ekleyin:

@media screen and (max-device-width: 970px) and (orientation: landscape){
   .slider-fix {
   height: 320px !important;
   }
}arayüzde silder yerleşimi doğru mantıkta yapılmamış. o bölümü tekrar yazdırmanız daha sağlıklı olabilir.

BaskentYapim · Answer

Misafir adlı üyeden alıntı:						mesajı görüntüle									Notepad++ ile girdim şimdi ilgili satır 567 olarak görünüyor maincss de
 		sorun yok kayma olabilir satırda sonucta ben uzaktan girip detay verdim. illahi aşagı yukarı bir kaç satır oynmar. evet dogru yerdesin. o değeri sıfır yaptıgında ürünler arasındaki bariz boşlukta gitmiş olacak.

bunu yaptıktan sonra tarayıcında cerezleri sil.  yoksa yaptığın değişiklikleri anlık göremessin.

aksoy · Answer

969 px, 900px boşluk var
Mobil px üst üste binen yerler de var
komple mobil css yi elden geçirmek gerek

İPM · Answer

aksoy adlı üyeden alıntı:						mesajı görüntüle									969 px, 900px boşluk var
Mobil px üst üste binen yerler de var
komple mobil css yi elden geçirmek gerek 		Bir arkadaş bakıyor hocam forum dışından ama sıkıntı olursa, ücretli de olur yardımcı olursanız sevinirim.

aksoy · Answer

Tamam hocam ücretsiz yapabildiğimiz kadarını yaparız, sorun yok

aksoy · Answer

@media (max-width:1200px){

.content .row{
top:20px;
}

}

@media (max-width:990px){

.content .row{
top:30px;
}

}

@media (max-width:969px){

.content .row{
top:-125px;
}

}

@media (max-width:900px){

.content .row{
top:-115px;
}

}

@media (max-width:767px){

.content .row{
top:175px;
}

}

@media (max-width:350px){

.content .row{
top:40px;
}

}Şimdi biraz bakrım da, bu kodları ekler misiniz?

İPM · Answer

aksoy adlı üyeden alıntı:						mesajı görüntüle									@media (max-width:1200px){

.content .row{
top:20px;
}

}

@media (max-width:990px){

.content .row{
top:30px;
}

}

@media (max-width:969px){

.content .row{
top:-125px;
}

}

@media (max-width:900px){

.content .row{
top:-115px;
}

}

@media (max-width:767px){

.content .row{
top:175px;
}

}

@media (max-width:350px){

.content .row{
top:40px;
}

}Şimdi biraz bakrım da, bu kodları ekler misiniz? 		Nereye ekleyelim tam olarak.

aksoy · Answer

Aslında çok yakın px ler var 900px var hemen yanında 969px var, 969'a hiç gerek yok

aksoy · Answer

Style css, ana css dosyanızın içine ekleyin

İPM · Answer

hicyilmaz adlı üyeden alıntı:						mesajı görüntüle									Wordpress mi? 		php özel script

aksoy · Answer

main.css dosyasının en başına ekleyin

İPM · Answer

aksoy adlı üyeden alıntı:						mesajı görüntüle									main.css dosyasının en başına ekleyin 		teşekkürler deniyorum.

İPM · Answer

aksoy adlı üyeden alıntı:						mesajı görüntüle									@media (max-width:1200px){

.content .row{
top:20px;
}

}

@media (max-width:990px){

.content .row{
top:30px;
}

}

@media (max-width:969px){

.content .row{
top:-125px;
}

}

@media (max-width:900px){

.content .row{
top:-115px;
}

}

@media (max-width:767px){

.content .row{
top:175px;
}

}

@media (max-width:350px){

.content .row{
top:40px;
}

}Şimdi biraz bakrım da, bu kodları ekler misiniz? 		Hiç bir değişiklik olmadı malesef.

aksoy · Answer

Bilgileri özelden gönderebilir misiniz

İPM · Answer

brown adlı üyeden alıntı:						mesajı görüntüle									css dosyanızın en altına ekleyin:

@media screen and (max-device-width: 970px) and (orientation: landscape){
   .slider-fix {
   height: 320px !important;
   }
}arayüzde silder yerleşimi doğru mantıkta yapılmamış. o bölümü tekrar yazdırmanız daha sağlıklı olabilir. 		Buda çalışmadı hocam

İPM · Answer

Halil0707 adlı üyeden alıntı:						mesajı görüntüle									main.css 525. satırdaki şu kısmı bulun:

.content {
 margin: 50px 0 86px 0;
 }şununla değiştirin:

.content {
 margin: 18px 0 86px 0;
}Çerez olmayan bir tarayıcıda kontrol edin. main.css dosyanızı tarayıcıda açın, kodların geçerli olup olmadığını görün. Geçerli ve olmuyor ise !important ile 18px margin'e zorlayın. Kodlar orada görünmüyor ise önbellek temizlemeniz gerekir. SHIFT + F5 ile sayfayı yenilemek genelde çözüm olur.

Aynı sorun footer üzerinde de var. içeriği .content divi içerisine alıp alt ve üst boşluk vermişler. Alttaki boşluğu da kaldırmak isterseniz
.content {
 margin: 5px 0 5px 0;
}böyle güncelleyebilirsiniz. 		Header halloldu teşekkürler, footer için kodlar hangi satırda acaba?

Halil0707 · Answer

size aslında sadece .content için margin değerlerini verdim. 18px olarak güncellediğiniz alan margin-top'ı ifade eder. 86px olan kısım margin-bottom'ı ifade eder. yani buradaki 86px değerini 10px yaparsanız footer üzerindeki boşluğu gidermiş olursunuz. Aslında footer üzeri boşluk değil, .content altındaki boşluktur o.

css dosyanızda şu şekilde yer alırsa sorun çözülecektir.
content {
margin: 18px 0 10px 0;
}tekrar baktığımda bu işlemin slider üzerindeki boşluğu etkilediğini de görüyorum. onu da gidermeniz gerekir.

Misafir adlı üyeden alıntı:						mesajı görüntüle									Header halloldu teşekkürler, footer için kodlar hangi satırda acaba?

İPM · Answer

rgb1903 adlı üyeden alıntı:						mesajı görüntüle									Sorununuzun hallolmasına sevindim. İyi forumlar. 		Keşke hallolsa  bir şey halletmedik daha..

rgb1903 · Answer

Bunu düzeltmek için tasarımı farklı ekran boyutlarına, yatay ve dikey olarak ayarlamalısınız.

Caxing · Answer

Büyük ihtimal CSS'den düzenlenmesi gerekiyor. Bilgisayarınızdan o kısma sağ tıklayın, incele deyin. Açılan pencereden mobil çözünürlüğe alın, boşluğun nedeni belli olacaktır.

İPM · Answer

rgb1903 adlı üyeden alıntı:						mesajı görüntüle									Bunu düzeltmek için tasarımı farklı ekran boyutlarına, yatay ve dikey olarak ayarlamalısınız. 		Hiç bilgim yok o konularda, hani belli bir kod falansa bulup düzelteyim dedim.

BaskentYapim · Answer

Slider den kaynaklanıyor.  en az 2 adet slider yüklemenizi isteyeceğim. buna göre tekrardan kodlara bakıp yardımcı olayım kardeşim

rgb1903 · Answer

Sadece kodla yapılacağını sanmıyorum. Bunu yaparken sadece dikey mod için tasarım yapılmış, bir de yatay mod içün yapmak lazım.

İPM · Answer

BaskentYapim adlı üyeden alıntı:						mesajı görüntüle									Slider den kaynaklanıyor. en az 2 adet slider yüklemenizi isteyeceğim. buna göre tekrardan kodlara bakıp yardımcı olayım kardeşim 		yaptım şu an. Slider da 1 den fazla görsel olunca da görseli ileri geri al butonu mobilde dik ekranda 2. ürünün arkasında kalıyor, o kısımda bir hata mevcut komple sanırım.

İPM · Answer

rgb1903 adlı üyeden alıntı:						mesajı görüntüle									Sadece kodla yapılacağını sanmıyorum. Bunu yaparken sadece dikey mod için tasarım yapılmış, bir de yatay mod içün yapmak lazım. 		Full responsive uyumlu diye almıştık zamanında yazılımı. Firma da devretti destek de alamıyoruz malesef.

rgb1903 · Answer

Sorununuzun hallolmasına sevindim. İyi forumlar.

BaskentYapim · Answer

Misafir adlı üyeden alıntı:						mesajı görüntüle									yaptım şu an. Slider da 1 den fazla görsel olunca da görseli ileri geri al butonu mobilde dik ekranda 2. ürünün arkasında kalıyor, o kısımda bir hata mevcut komple sanırım. 		Ürünler arasındaki boşluğu almanız için şu yolu izletin...
main.css dosyasında satır 677 kısmında min-height : 314px kısımdaki sayı değerini 0 olacak şekilde ayarlayın.

İPM · Answer

BaskentYapim adlı üyeden alıntı:						mesajı görüntüle									Ürünler arasındaki boşluğu almanız için şu yolu izletin...
main.css dosyasında satır 677 kısmında min-height : 314px kısımdaki sayı değerini 0 olacak şekilde ayarlayın.
 		Satır göremiyorum notepad ile açtım doğru satır mı acaba fotodaki.

BaskentYapim · Answer

Misafir adlı üyeden alıntı:						mesajı görüntüle									Satır göremiyorum notepad ile açtım doğru satır mı acaba fotodaki. 		aynen 314 olan sayıyı 0  yap ve kaydet. By arada Notepad++ kullan

İPM · Answer

BaskentYapim adlı üyeden alıntı:						mesajı görüntüle									aynen 314 olan sayıyı 0 yap ve kaydet. By arada Notepad++ kullan 		Etkisi olmadı malesef.

BaskentYapim · Answer

Misafir adlı üyeden alıntı:						mesajı görüntüle									Etkisi olmadı malesef. 		Etkisinin olmaması imkansız. Notepat++ kurup ilgili satıra gidip düzeltmeniz gerekmekte. ayrıca iki önceki mesajımı gözden geçirin. resimli olarak düzenleme yaptım. resim ekledim yani oraya bakarakta ilgili alanı bulabilirsiniz.
not: bahsettiğim olay ürünler arasındaki boşluğu almaktı

İPM · Answer

BaskentYapim adlı üyeden alıntı:						mesajı görüntüle									Etkisinin olmaması imkansız. Notepat++ kurup ilgili satıra gidip düzeltmeniz gerekmekte. ayrıca iki önceki mesajımı gözden geçirin. resimli olarak düzenleme yaptım. resim ekledim yani oraya bakarakta ilgili alanı bulabilirsiniz.
not: bahsettiğim olay ürünler arasındaki boşluğu almaktı 		Notepad++ ile girdim şimdi ilgili satır 567 olarak görünüyor maincss de

hicyilmaz · Answer

Wordpress mi?