• 26-02-2015, 13:46:39
    #1
    F. STACK WEB + MOBILE DEV
    Merhaba arkadaşlar,

    Şuana kadar 4-5 farklı tasarımı Bootstrap ile kodladım, hiç sorun yaşamadım ama bugün bir tasarımı dökerken Bootstrap yeterli gelmedi. Bildiğiniz gibi Bootstrap'ta xs,sm,md,lg gibi boyutlar var ve en küçü xs 768px'den küçükleri kapsıyor.

    Ancak en düşük telefon genişliği 240px ve en küçük telefon genişliği ile 768px arasında çok büyük bir fark oluyor.

    Merak ettiğim bizde atıyorum "mk" adlı bir boyut oluşturup 480px'den küçükleri kapsayan bir "col-mk-*" şeklinde bir class yaratabiliyor muyuz? Tabi grid çerçevesinde. bootstrap.css'i biraz inceledim ama işin içinden çıkamadım, aslında XS'a @media etiketi içinde min width 480 dedim, ardından bir XS daha oluşturup her hangi bir @media etiketi vermedim ama yine de olmadı.
  • 26-02-2015, 13:49:31
    #2
    yaparsın. css içinde xs için olan tüm kuralları mk için koy.

    genel kurallara uyarsan yapmana gerek kalmaz. sorun cıkaran nedir sana ?
  • 26-02-2015, 14:00:00
    #3
    F. STACK WEB + MOBILE DEV
    ~Aykut adlı üyeden alıntı: mesajı görüntüle
    yaparsın. css içinde xs için olan tüm kuralları mk için koy.

    genel kurallara uyarsan yapmana gerek kalmaz. sorun cıkaran nedir sana ?
    XS'yi kopyaladım, ayrı bir sayfada yapıştırdım ve sayfada ki tüm XS'leri mk'ya çevirdim,
    ardından XS'yi @media (min-width: 480px) etiketi içine aldım ve düzenlediğim XS'yi alıp o sayfaya yerleştirdim ama olmadı çalışmadı yani normalmiş gibi davrandı sayfada
  • 26-02-2015, 14:04:14
    #4
    Tonks adlı üyeden alıntı: mesajı görüntüle
    XS'yi kopyaladım, ayrı bir sayfada yapıştırdım ve sayfada ki tüm XS'leri mk'ya çevirdim,
    ardından XS'yi @media (min-width: 480px) etiketi içine aldım ve düzenlediğim XS'yi alıp o sayfaya yerleştirdim ama olmadı çalışmadı yani normalmiş gibi davrandı sayfada
    mantık olarak yapılabilir olduğu doğru ama sıkıntı hangi içerikte ise ona müdahale etmen geriyor. bence sen sorununu yanlış yoldan çözmeye çalışıyorsun
  • 26-02-2015, 14:08:46
    #5
    F. STACK WEB + MOBILE DEV
    ~Aykut adlı üyeden alıntı: mesajı görüntüle
    mantık olarak yapılabilir olduğu doğru ama sıkıntı hangi içerikte ise ona müdahale etmen geriyor. bence sen sorununu yanlış yoldan çözmeye çalışıyorsun
    hayır hocam sanmıyorum sonuçta twitter 3 sırlerde bir şeylenıfa genişlik vermiş diğerini kendi haline bırakmış, bizde o kendi haline bırakılmışa bir genişlik verip yeni bir kendi haline bırakılmış oluşturuyoruz ama bir yerlerde bir şeyler eksik,

    peki sizin önerebileceğiniz bir yol var mı?
  • 26-02-2015, 14:13:47
    #6
    Tonks adlı üyeden alıntı: mesajı görüntüle
    hayır hocam sanmıyorum sonuçta twitter 3 sırlerde bir şeylenıfa genişlik vermiş diğerini kendi haline bırakmış, bizde o kendi haline bırakılmışa bir genişlik verip yeni bir kendi haline bırakılmış oluşturuyoruz ama bir yerlerde bir şeyler eksik,

    peki sizin önerebileceğiniz bir yol var mı?
    calismani nete ekliyip link verirsen soylerim nasıl yapman gerektigini
  • 26-02-2015, 20:36:09
    #7
    F. STACK WEB + MOBILE DEV
    ~Aykut adlı üyeden alıntı: mesajı görüntüle
    calismani nete ekliyip link verirsen soylerim nasıl yapman gerektigini
    Buyrun hocam oluşturduğum bootstrap dosyası

    http://dosya.co/f7785x5btcte/custom-bootstrap.css.html
  • 26-02-2015, 20:49:32
    #8
    Classlar yaratmak yerine belirli query aralıklarında bootsrap classlarını ezmeyi denersiniz daha pratik sonuca ulaşırsınız.

    @media(min-width:240px) and(max-width:480px) {
    #a .col-xs-3 { width:20%}
    }

    Gibi..
  • 26-02-2015, 20:57:04
    #9
    F. STACK WEB + MOBILE DEV
    sndrock adlı üyeden alıntı: mesajı görüntüle
    Classlar yaratmak yerine belirli query aralıklarında bootsrap classlarını ezmeyi denersiniz daha pratik sonuca ulaşırsınız.

    @media(min-width:240px) and(max-width:480px) {
    #a .col-xs-3 { width:20%}
    }

    Gibi..
    evet mantıklı bunu da bir deneyeceğim