responsive yaparken css işlemiyor neden olabilir yardım - Sayfa 2

26-03-2019, 18:53:48

#10

Daryl_Dixon adlı üyeden alıntı: mesajı görüntüle

Html de <head> tagları arasına aşağıdaki kodu eklemelisin;

<meta name="viewport" content= "width=device-width, initial-scale=1.0">

ekledim ama css veriyorum işlemiyor

26-03-2019, 18:54:39

#11

Daryl

ozgun58 adlı üyeden alıntı: mesajı görüntüle

ekledim ama css veriyorum işlemiyor

Site adresini paylaşırsan yardımcı olabiliriz.

26-03-2019, 19:13:00

#12

bulutaylak

320 düşük bir rakam, ekranın o kadar küçülmeyebilir. Onu siz 479px yapın.

Gördüğün gibi r10 bile anca bu kadar küçülüyor, tarayıcın daha fazlasını engeller.
http://prnt.sc/n37w9u

26-03-2019, 19:19:30

#13

ozgun58

bulutaylak adlı üyeden alıntı: mesajı görüntüle

320 düşük bir rakam, ekranın o kadar küçülmeyebilir. Onu siz 479px yapın.

Gördüğün gibi r10 bile anca bu kadar küçülüyor, tarayıcın daha fazlasını engeller.
http://prnt.sc/n37w9u

farketmiyor farklı bir pixelden de yapıldığında işlemiyor importtan dolayı olduğunu düşünüyorum

26-03-2019, 19:21:58

#14

bulutaylak

İmportant eklemeyin o zaman, responsive css dosyan asıl css dosyandan sonra yüklensin bu sayede bastırmak için uğraşmazsınız. Ayriyetten fark eder, 320px olarak yazdığın kodların hiçbiri geçerli olmaz çünkü tarayıcı o kadar küçülmeye gitmiyor deneyebilirsin.

26-03-2019, 19:38:01

#15

Hunper

Sorun birkaç şeyden kaynaklanıyor olabilir. Sayfayı görmeden net bir şey söylemek zor. Ne yapmaya çalıştığın da önemli burada. Bottom ile aşağıdaki element ile arasına 100px boşluk atmaya çalışıyorsan bunu bu yazdığın kodlar ile başaramazsın.

İlk olarak; İki media kodunu da max-width olarak kullanmışsınız, 768px için kullandığınız max-width aynı zamanda 320px'i de kapsıyor ve !important kullandığınız için biri diğerini engelliyor olabilir.

İkinci seçenek daha anlamlı, bottom: özelliğini yalnızca position:abolute durumlarda kullanmanız ve sadece sayfada veya div içerisinde genel kapsayıcı alanın içinde, aşağıdan hizalanmasını istediğiniz divler için kullanmanız daha sağlıklı olacaktır, siz hem margin-bottom hem de bottom kullanmaya çalışıyorsunuz.

Site adresi verebilirseniz daha iyi yardımcı olabiliriz ya da tam olarak yapmak istediğinizi ve alanın görselini atabilirsiniz. Başka türlü bir şey söylemek çok zor, göründüğü üzere çok sağlıksız bir kod yazımı mevcut, position:relative olan bir div elemanına left ve bottom kullanmaya gerek olacağını düşünmüyorum. Bu yüzden ne yapmak istediğinizi bilmeden yardımcı olmak zor.

26-03-2019, 20:03:35

#16

ozgun58

Hunper adlı üyeden alıntı: mesajı görüntüle

Sorun birkaç şeyden kaynaklanıyor olabilir. Sayfayı görmeden net bir şey söylemek zor. Ne yapmaya çalıştığın da önemli burada. Bottom ile aşağıdaki element ile arasına 100px boşluk atmaya çalışıyorsan bunu bu yazdığın kodlar ile başaramazsın.

İlk olarak; İki media kodunu da max-width olarak kullanmışsınız, 768px için kullandığınız max-width aynı zamanda 320px'i de kapsıyor ve !important kullandığınız için biri diğerini engelliyor olabilir.

İkinci seçenek daha anlamlı, bottom: özelliğini yalnızca position:abolute durumlarda kullanmanız ve sadece sayfada veya div içerisinde genel kapsayıcı alanın içinde, aşağıdan hizalanmasını istediğiniz divler için kullanmanız daha sağlıklı olacaktır, siz hem margin-bottom hem de bottom kullanmaya çalışıyorsunuz.

Site adresi verebilirseniz daha iyi yardımcı olabiliriz ya da tam olarak yapmak istediğinizi ve alanın görselini atabilirsiniz. Başka türlü bir şey söylemek çok zor, göründüğü üzere çok sağlıksız bir kod yazımı mevcut, position:relative olan bir div elemanına left ve bottom kullanmaya gerek olacağını düşünmüyorum. Bu yüzden ne yapmak istediğinizi bilmeden yardımcı olmak zor.

öncelikle ilgi ve alakanızdan dolayı çok teşekkürler hocam site ismini pm ile yolladım

27-03-2019, 04:43:40

#17

ayyldz

Hocam tam olarak ne yapacaksınız bilmiyorum ama ben denedim çalıştı :/
class 'ı etkileyen başka bir .css kodu olabilir mi acaba, herhangi bir sayfada.

<div class="ucuncu">
<span class="h10">ucuncu</span>
<div class="bgym">
bgym
</div>
<span class="h10">alt sira</span>
</div>

.ucuncu {
background:#eee;
margin:100px auto;
padding:50px;
}
span.h10 {
display:block;
height:20px;
background:#ddd;
}

.ucuncu .bgym{
position:relative;
height:20px;
background:#aaa;
bottom:20px;
margin-bottom:10px;
}

@media screen and (max-width:768px){
 
.ucuncu .bgym{
bottom:40px;
margin-bottom:20px;
}
}
 
 
@media screen and (max-width:500px){
 
 
.ucuncu .bgym{
bottom:60px;
margin-bottom:40px;
}
}