HTML gibi Facebook düğmesi web sitesinin duyarlılığını bozar

Question

Facebook sayfası düğmesi (kutu değil) web sitemin mobil cihazlarda yanıt verebilirliğini bozar.

<div class="fb-like" data-href="https://www.facebook.com/myamazingfbpage" data-layout="button" data-action="like" data-show-faces="false" data-share="false"></div> 

duyarlı yapısı bozulmadan iken, görüntü alanının sağ tarafına doğru büyük bir boşluk/blok/bölüm vardır: Aşağıda düğme gibi Facebook için kodudur. Beyaz boşluk/blok/bölümün zorlanması için web sitesi düzeninden hiçbir şey çıkmıyor. Düğmeler sol kenar çubuğunda. Ben inline-block olarak ing display denedi

, float, aşırı left bunu ed o margin ve 0 için padding var azalttı. Üstelik, aynı zamanda twitter takip düğmesine izin vermez. Ayrıca 'a <span>'u denedim.

Hepsi boşuna.

Arkadaşlarıma şimdiden teşekkürler. :)

Answer 1

Bir WordPress eklentisi kullanıyorsunuz ve bu eklentinin özel CSS'si soruna neden oluyor gibi görünüyor. Doğru şekilde ayarladığınızdan veya eklentinin CSS'si ile bir hata oluşturduğunuzdan emin değilsiniz.

suçlu bu CSS seçici geçerli: seçici yukarıdaki <span> senin soru yayınlanmıştır ilk bağımlısı olan bir <span> hedefliyor

.fb-like span { 
    overflow: visible!important; 
    width: 450px!important; 
    margin-right: -375px; 
} 

.Düğme belirli bir genişlikverildi olsa bile, Dev Tools'da yayınınızın 75px geniş olduğunu fark edeceksiniz. Bunun nedeni yukarıdaki seçiciden kaynaklanmaktadır. Yukarıdaki seçici, 450px genişliğini belirtir ve 0129'u negatif bir kenar boşluğuyla çıkarır ve 75px numaralı düğmeyi bırakarak, düğme yalnızca 49px olarak sağ tarafta ekstra alan oluşturur.

1. Referans onu uygun şekilde yapılandırılmış emin olmak için eklenti o WordPress için elverişli olabilecek herhangi dokümanlar:
   yapmanız gerekir ya sorunu gidermek için.
2. Mümkünse seçiciyi çıkarın.
3. Seçemezseniz, seçiciyi geçersiz kılın. Söz konusu

WordPress: Easy Social Share Buttons