• 01-07-2023, 21:19:00
    #1
    Dostlar selam,
    Ufak bir css yardıma ihtiyacım var. Müsait olan bakabilir mi?



    Webde böyle görünüyor. Mobilde de üstteki gibi görünmesini istiyorum.



    Mobilde altalta sıralıyor.
    Yanyana aldığımda da sayfadan taşıyor.

      
    
    
    /* Genel stiller */
    .swapp {
        display: flex;
        align-items: center;
        justify-content: center;
        margin-top: 15px;
    }
    
    .swapp label {
        margin-right: 10px;
        font-size: 18px;
    }
    
    #nereden,
    #nereye {
        padding: 10px;
        font-size: 18px;
        border: 1px solid #ccc;
        border-radius: 4px;
        width: 200px;
        text-align: center;
        font-size: 22px;
    }
    
    #swapButton,
    .swap-class {
        font-size: 18px;
        padding: 10px 16px;
        background-color: #4c81af;
        color: white;
        border: none;
        border-radius: 4px;
        cursor: pointer;
    }
    
    #swapButton:hover,
    .swap-class:hover {
        background-color: #396d9a;
    }
    
    /* Mobil stiller */
    @media (max-width: 600px) {
        .swapp {
            flex-direction: row;
            flex-wrap: wrap;
            justify-content: center;
        }
    
        .swapp label {
            margin-bottom: 10px;
        }
    
        #nereden,
        #nereye {
            margin: 0 10px;
        }
    }

    nereden nereye idsine
    width 50% verdim sorun çözüldü
  • 01-07-2023, 21:22:06
    #2
    width değerleri ile ilgili, onları düzenleyip deneme yapabilirsin mobil için
  • 01-07-2023, 21:23:32
    #3
    GokhanGok adlı üyeden alıntı: mesajı görüntüle
    width değerleri ile ilgili, onları düzenleyip deneme yapabilirsin mobil için
    teşekkür ederim kaf sin kaf
    • GokhanGok
    GokhanGok bunu beğendi.
    1 kişi bunu beğendi.
  • 01-07-2023, 21:38:44
    #4
    Bu sorun devam ediyor çözülmedi
  • 02-07-2023, 13:59:32
    #5
    🥇R10'un En İyi Ajansı 🥇
  • 02-07-2023, 17:53:24
    #6
    Responsive isteniyor mutlaka flex kullanılmalı. Küçük bir örnek hazırladım. Bu örnek içinde bulunduğu container'e farklı şekillerde görünebilir. Bu yüzden container'in de flex olması veya genişliğinin %100 olması önemli.

  • 02-07-2023, 20:03:54
    #7
    NGEEN adlı üyeden alıntı: mesajı görüntüle
    Responsive isteniyor mutlaka flex kullanılmalı. Küçük bir örnek hazırladım. Bu örnek içinde bulunduğu container'e farklı şekillerde görünebilir. Bu yüzden container'in de flex olması veya genişliğinin %100 olması önemli.


    hocam teşekkür ederim elinize sağlık
    • NGEEN
    NGEEN bunu beğendi.
    1 kişi bunu beğendi.