lostyazilim

Tam ekranda scroll sorunu

4 Mesajlar 870 Okunma
lstbozum
wmaraci reklam

4531 4531 WM Aracı Anonim Üyelik
  • Üyelik 13.03.2012
  • Yaş/Cinsiyet - /
  • Meslek
  • Konum
  • Ad Soyad ** **
  • Mesajlar 996
  • Beğeniler 210 / 211
  • Ticaret 3, (%100)
Merhaba arkadaşlar tek sayfa bir tasarım yapıyorum ve bir adet div'im var.
yüksekliği 100% üst tarafta ise menüm var ve ben menü div'in üstüne gelmesin diye top:70px kullanıyorum. Ancak böyle yapınca div tam olarak görüntülenmiyor yani en allta 70px'lik bir kayıp yaşıyorum. Padding-bottom:70px ile çözüyorum ancak bu seferde responsive de sorun yaşıyorum. Acaba bir çözüm biliyor musunuz?

Tam olarak nasıl anlatacağımı bilemiyorum ama sanırım görsel az da olsa bir şeyler anlatır.



//scss
.portfolio-content {
position: relative;
height:100vh;
margin-top: 70px;
.portfolio-item {
background: #fff;
padding: 10px;
@include golge;
margin: 15px 0;
img {
width: 100%;
height: 200px;
}
.portfolio-item-title {
text-align: center;
display: block;
padding: 10px 0 0;
@include font(Josefin,400,1.2em);
}
}
}




// 50-60 adet portfolyo itemi olacak





//body
body {
font: 100%;
overflow: hidden;
position: relative;
height:100vh;
margin:0;
padding:0;
}


Ek Olarak:
 

 

wmaraci
reklam

hayaller hayaller elbuz.org Kullanıcı
  • Üyelik 21.08.2015
  • Yaş/Cinsiyet 32 / E
  • Meslek web master
  • Konum İstanbul Anadolu
  • Ad Soyad Y** E**
  • Mesajlar 13
  • Beğeniler 6 / 1
  • Ticaret 0, (%0)
3 kere okudum zor anladım problemi :)

şöyle yapman gerekiyor
üste bir tane div oluştur menü divi bu divin style'ne height:150px yaz (sayıyı kafamdan uydurdum)
sonra altına içerik divini oluştur ve style şu kodu yaz height:calc(100% - 150px)

hadi kolay gelsin :)

not: calc fonksiyonundaki 150px nin nerden geldiğini anladığını umuyorum.
 

 

4531 4531 WM Aracı Anonim Üyelik
  • Üyelik 13.03.2012
  • Yaş/Cinsiyet - /
  • Meslek
  • Konum
  • Ad Soyad ** **
  • Mesajlar 996
  • Beğeniler 210 / 211
  • Ticaret 3, (%100)

hayaller adlı üyeden alıntı

3 kere okudum zor anladım problemi :)


hadi kolay gelsin :)

not: calc fonksiyonundaki 150px nin nerden geldiğini anladığını umuyorum.


Teşekkürler hocam, valla sorunu ben anlamadım anlatamıyorum o yüzden bir de yarım yamalak İngilizcemle stackoverflow'da da konu açtım Türkçe anlatamadığım konuyu orada İngilizce anlatmaya çalıştım görmelisiniz. :D

Sonunda zaten bu şekilde çözmüştüm ben başka bir yol var mı diye merak ediyordum.

Mobilde sorun veriyordu onuda halletim temam çok güzel oldu.
Tekrardan teşekkürler.
 

 

hayaller hayaller elbuz.org Kullanıcı
  • Üyelik 21.08.2015
  • Yaş/Cinsiyet 32 / E
  • Meslek web master
  • Konum İstanbul Anadolu
  • Ad Soyad Y** E**
  • Mesajlar 13
  • Beğeniler 6 / 1
  • Ticaret 0, (%0)
rica ederim, çözdüğüne sevindim.
 

 

wmaraci
wmaraci
wmaraci
Konuyu toplam 1 kişi okuyor. (0 kullanıcı ve 1 misafir)
Site Ayarları
  • Tema Seçeneği
  • Site Sesleri
  • Bildirimler
  • Özel Mesaj Al