@Trends; 1. madde de sorun yaşamanızın sebebi css in eski versiyonundan gelen float:left kullanımı... Eskiden ürünleri belirli bir düzende yanyana getirmek sığmayınca alta almak için float:left kullanılırdı ancak artık bu özelliğin kullanımına gerek yok.
Css3 ile gelen flex yapısını inceleyip uygularsanız sorununuz düzelir. 2. maddeuyi ise pek anlayamadım şahsen..
Öncelikle yanıtınız için teşekkür ederim. CSS konusunda şu an için sığ bir bilgiye sahip olduğum için yapıyı değiştirmeye açıkçası gözüm kesmiyor.
@mustafasatirogl; hocam doğru bir tespite bulunmuş. Ayrıca bu sorun genelde yükseklik sorunlarından kaynaklı oluyor, ürün başıklarının bazıları 3 satır gorunurken bazıları 2 satır şeklinde buna sabit bir yükseklik vererek sorunu hızlı bir şekilde çözebeilirsiniz. Aşağıda yazdığım kod işinizi görür ama mantıklı olan flex veya grid kullanmak
.product-grid .product .name {height: 70px; overflow: hidden;}
Size ayrıca teşekkür ederim, söylediğiniz şekilde tarayıcı üzerinde uyguladığımda sorun çözüldü. Şimdi normal uygulama yapacağım.
Yanıt veren arkadaşlara teşekkür ederim. Bir de hover'da yeşil olan kısmın hover olmadan da border'lı olmasını istiyorum bu konuda da yardımcı olursanız çok memnun olurum