[Google-Maps] التغريد Bootstrap CSS يؤثر على خرائط جوجل



Answers

هناك أيضًا مشكلة في محددات القائمة المنسدلة للتضاريس والتراكبات ، وسيؤدي كلاهما إلى إصلاح المشكلات ...

#mapCanvas img { 
  max-width: none;
}

#mapCanvas label { 
  width: auto; display:inline; 
} 

النمط الثاني سيؤدي إلى حل مشكلات أخرى مع مربع التضاريس والتراكب في بعض المتصفحات.

Question

أنا أستخدم Twitter Bootstrap ، ولدي خريطة Google.

يتم تشويه الصور الموجودة على الخريطة ، مثل العلامة ، بواسطة CSS في Bootstrap.

في Bootstrap CSS يوجد:

img {
    border: 0 none;
    height: auto;
    max-width: 100%;
}

عند تعطيل خاصية max-width باستخدام Firebug ، تظهر صورة العلامة كالمعتاد. كيف يمكنني منع Bootstrap CSS من التأثير على صور خرائط Google؟




أحدث bootstrap تويتر 2.0.4 يتضمن هذا الإصلاح مباشرة.

إذا كنت تقوم بتغليف المحتوى الخاص بك في (div class = "container") كما في صفحة العرض التوضيحي لـ bootstrap twitter ، فيجب إضافة نمط = "height: 100٪"




تغيير #MapCanvas لم يعمل بالنسبة لنا باستخدام gmap4rails جوهرة ، ولكن عندما قمنا بتغيير

.map_container img {
    max-width: none;
}

.map_container label {
    width: auto; display:inline;
}



لم تنجح أي من هذه الإجابات بالنسبة لي ، فدخلت إلى القسم الخاص بي ونظرت إلى أطفالها. رأيت قسمًا جديدًا مع "gm-class" ، لذلك وضعت هذا في CSS الخاص بي:

.gm-style img {
    max-width: none;
  }

  .gm-style label {
    width: auto; display:inline;
  }

.. و التي تحل المشكلة بالنسبة لي.




واضطررت أيضاً إلى إيقاف ظلال ظبطتي ، وبسبب ترتيب مكاني ، أضفت العلم الهام.

#mapCanvas img {
    max-width: none !important;
    box-shadow: none !important;
}



Links