CSS slaytında yazıları ayarlama

yone1108 dedi:

@media only screen and (max-width: 600px) {
#classismi {
flex-direction: column;
}

bu kodun çalışması gerekiyor hocam. Footer kodlarının ekran görüntüsünü atar mısınız

Genişletmek için tıkla...

Antares dedi:

Eki Görüntüle 989926

Genişletmek için tıkla...

yone1108 dedi:

hangi classa bu özelliği vermek istiyorsunuz direk footer mı?

Genişletmek için tıkla...

yone1108 dedi:

Hocam kodlarda bende denedim ancak sonuç olumsuz. Çalışmıyor.

Genişletmek için tıkla...

Antares dedi:

Anladım hocam peki bunu her .div etiketini margin-top ile ayarlayabilir miyiz?

Genişletmek için tıkla...

yone1108 dedi:

Evet o şekilde ayarlayabilirsiniz.
@media içerisine her div için ayrı ayrı değer verebilirsiniz. Aşağıdaki örnek gibi.

@media only screen and (max-width: 600px) { .sag{ margin-top: 10px; } .sol{ margin-top: 10px; } .orta { margin-top: 10px; } }

Genişletmek için tıkla...

Antares dedi:

Ayarladım hocam fakat böyle bir şey oluştu.
Eki Görüntüle 989940

Genişletmek için tıkla...

yone1108 dedi:

position absolute verdiniz mi?

Genişletmek için tıkla...

Antares dedi:

Kodların hepsi burada hocam bugünlük daha fazla uğraşamayacağım bana bu saatte zaman ayırdığınız için teşekkür ederim gerçekten sağolun.
footer{
display: flex;
background-color: #191919;
height: 300px;
color: #fff;
position: relative;
margin-top: 100px;
}
footer img{
opacity: 0.6;
width: 100%;
height: 100%;
}
.footer-logo{
width: 300px;
margin-top: 70px;
}
footer h3{
font-size: 28px;
margin-bottom: 20px;
margin-top: 0px;
}
.sol{
width:30%;

position: absolute;
z-index: 99;
}
.orta{
position: absolute;
width: 100%;
text-align: center;
top: 40%;
z-index: 99;

font-size: 18px;

}
.orta input{
width: 230px;
height: 28px;
background-color:#000000;
opacity:0.6;
filter:alpha(opacity=60);
color: #fff;
margin-right: 15px;

}
.sag{
position: absolute;
width: 100%;
text-align: right;
top: 30%;
z-index: 99;
}
.sag i{
margin-right: 60px;
cursor: pointer;
}


@media only screen and (max-width: 900px) {
.orta{
margin-top: 150px;
position: absolute;
}
.sag{
margin-top: 300px;
float: left;
margin-left: -60px;
position: absolute;
}
.arkaresım{
height: 500px;
position: absolute;
}
}

Genişletmek için tıkla...