lostyazilim
tr.link

Css kenar ayarı hakkında

7 Mesajlar 1.520 Okunma
lstbozum
tr.link

mile1858 mile1858 WM Aracı Kullanıcı
  • Üyelik 17.01.2016
  • Yaş/Cinsiyet 27 / E
  • Meslek .
  • Konum Diğer
  • Ad Soyad R** A**
  • Mesajlar 389
  • Beğeniler 191 / 51
  • Ticaret 2, (%100)
Merhaba aşağıdaki fotoğrafta görüldüğü gibi yan yana 4 tane div ekleyince problemsiz olabiliyor ancak devam etmek istediğimde ikisi birden aşağıya atlıyor?

margin-right değerini biraz kısmayı deniyorum bu seferde sağda açık kalıyor ben tam oturmasını istiyorum.

Fotoğraflar 4 taneyken;



Devam etmek isteyince;




Ürün HTML kodu;









500 TL









CSS;



body {
text-align: center;
margin: 0px auto;
font-family: 'Open Sans', sans-serif;
}

.urun-resim {
margin-top: 10px;

}

.urun-linki {
margin-top: 9px;
}

.urun-fiyati {
margin-top: 9px;
font-weight: bold;
}

.bosluk-10px {
margin-top: 15px;
}

#ortala {
width: 802px;
margin: 0 auto;
max-width: 802px;
}

.urun {
width: 180px;
height: 200px;
border: 1px solid #ddd;
float: left;

font-family: 'Open Sans', sans-serif;
border-radius: 8px;

margin-right: 26px;
margin-top: 15px;

}

.urun:last-child {
margin-right: 0px;

}


#ust {
width: 802px;

height: 90px;
display: table;
#position: relative;
overflow: hidden;

}

.ust-icerik {
#position: absolute;
#top: 50%;
display: table-cell;
vertical-align: middle;
}

#logo {
float: left;

}

.reklam {

float: right;
margin-right: 2px;


}


#urun-yuksekligi {
max-width: 802px;
height: 400px;

}

 

 

wmaraci
reklam

ERENKYI ERENKYI WM Aracı Kullanıcı
  • Üyelik 11.07.2017
  • Yaş/Cinsiyet 26 / E
  • Meslek Öğrenci
  • Konum İstanbul Avrupa
  • Ad Soyad E** K**
  • Mesajlar 169
  • Beğeniler 8 / 45
  • Ticaret 1, (%100)
https://jsfiddle.net/ERENKYI/nwobdzud/2/
mile1858

kişi bu mesajı beğendi.

mile1858 mile1858 WM Aracı Kullanıcı
  • Üyelik 17.01.2016
  • Yaş/Cinsiyet 27 / E
  • Meslek .
  • Konum Diğer
  • Ad Soyad R** A**
  • Mesajlar 389
  • Beğeniler 191 / 51
  • Ticaret 2, (%100)
Deniyorum hocam çok teşekkür ederim!
 

 

mile1858 mile1858 WM Aracı Kullanıcı
  • Üyelik 17.01.2016
  • Yaş/Cinsiyet 27 / E
  • Meslek .
  • Konum Diğer
  • Ad Soyad R** A**
  • Mesajlar 389
  • Beğeniler 191 / 51
  • Ticaret 2, (%100)
ERENKYI hocam problem şurada işte :( bu ilk 4 ünden sonra çıkan 26 px lik boşluk herşeyi bozuyor

 

 

wmaraci
wmaraci

ERENKYI ERENKYI WM Aracı Kullanıcı
  • Üyelik 11.07.2017
  • Yaş/Cinsiyet 26 / E
  • Meslek Öğrenci
  • Konum İstanbul Avrupa
  • Ad Soyad E** K**
  • Mesajlar 169
  • Beğeniler 8 / 45
  • Ticaret 1, (%100)
ramazan1478

.urun:nth-child(4n) {
margin-right: 0;
}


4n'i bir satırda kaç tane olmasını istiyorsanız ona göre ayarlayın. Ama responsive uyumlu değil. Responsive uyumlu olması için Javascript kullanmanız lazım.
mile1858

kişi bu mesajı beğendi.

mile1858 mile1858 WM Aracı Kullanıcı
  • Üyelik 17.01.2016
  • Yaş/Cinsiyet 27 / E
  • Meslek .
  • Konum Diğer
  • Ad Soyad R** A**
  • Mesajlar 389
  • Beğeniler 191 / 51
  • Ticaret 2, (%100)

ERENKYI adlı üyeden alıntı

ramazan1478

.urun:nth-child(4n) {
margin-right: 0;
}


4n'i kaç bir satırda kaç tane olmasını istiyorsanız ona göre ayarlayın. Ama responsive uyumlu değil. Responsive uyumlu olması için Javascript kullanmanız lazım.


Çok iyi oldu teşekkürler :)
 

 

OmerGunay OmerGunay https://omergunay.net Kullanıcı
  • Üyelik 15.05.2015
  • Yaş/Cinsiyet 33 / E
  • Meslek PHP Developer
  • Konum İstanbul Avrupa
  • Ad Soyad Ö** G**
  • Mesajlar 1207
  • Beğeniler 382 / 381
  • Ticaret 16, (%100)
bootstrap ile çok daha kolay çözebilirsin aslında bu sorunu ramazan1478
mile1858

kişi bu mesajı beğendi.

Herkes yediğinden ikram eder..(Yavuz Sultan Selim)
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