Coder arkadaşlar bir bakabilirmi - Sayfa 2

15-07-2021, 00:16:54

#10

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

O yuvarlakların olduğu büyük div için display:flex align-items:center yazarsan olur gibi bir de min slider itemlerini iç içe yazmışsın onları ayır. Divler iç içe girmiş.

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

float:left
margin: 0px 0px 10px 0px

tamamdır geçmiş olsun.

Olmadı maalesef hepsini yaptım ama aynı şekil sağa sola kaymaktan başka birşey olmuyor

15-07-2021, 00:20:06

#11

EurasiaCreative

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

O yuvarlakların olduğu büyük div için display:flex align-items:center yazarsan olur gibi bir de min slider itemlerini iç içe yazmışsın onları ayır. Divler iç içe girmiş.

divlerden kaynaklanıyormuş hocam sağoalsın

15-07-2021, 00:37:09

#12

poineandlimos

Kapsayıcı div'i display:flex yap. Ardından justify-content ile yatayda eşit aralıklı ya da tam ortaya hizalama yapabilirsin. Dikeyde de align-items:center ile ortalayabilirsin. Bahsettiğin tasarım için ise bu şekilde flex yapısı ile halledebilrsin. Kodlarının durumu için ise vsCode kullanıyorsan düzeltmek istediğin alanı seç ve format document de. Tüm kodları formatlayarak daha düzenli hale getirir.

15-07-2021, 00:39:18

#13

EurasiaCreative

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

Kapsayıcı div'i display:flex yap. Ardından justify-content ile yatayda eşit aralıklı ya da tam ortaya hizalama yapabilirsin. Dikeyde de align-items:center ile ortalayabilirsin. Bahsettiğin tasarım için ise bu şekilde flex yapısı ile halledebilrsin. Kodlarının durumu için ise vsCode kullanıyorsan düzeltmek istediğin alanı seç ve format document de. Tüm kodları formatlayarak daha düzenli hale getirir.

Deneme yanılma birşeyler yapıyordum oldu hocam sağolun

16-07-2021, 06:39:02

#14

Ofisto

divlerini kontrol et kardeşim ondan olabilir

19-07-2021, 00:31:26

#15

QuarkChain

<style type="text/css">
    .slider {
        width: 640px;
        margin: 0 auto;
    }
    .slider > div {
        margin: 0 auto;
        width: 640px;
        height: 340px;
        background-color: #eee;
    }
    .slider > ul {
        list-style: none;
        margin: 0;
        padding: 0;
        margin-top: 5px;
        display: flex;
        justify-content: center;
    }
    .slider > ul li {
        margin-right: 5px;
        background-color: #eee;
        width: 80px;
        height: 60px;
    }
    .slider > ul li:last-child {
        margin-right: 0;
    }
</style>

<div class="slider">
    <div><!-- Preview Image --></div>
    <ul>
        <li><!-- Thumb Image --></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
        <li></li>
    </ul>
</div>