টুইটার বুটস্ট্র্যাপ সিএসএস গুগল মানচিত্রকে প্রভাবিত করছে

Question

আমি টুইটার বুটস্ট্র্যাপ ব্যবহার করছি এবং একটি গুগল ম্যাপ রয়েছে।

মানচিত্রের চিত্রগুলি যেমন মার্কার বুটস্ট্র্যাপে সিএসএস দ্বারা স্কু করা হচ্ছে।

বুটস্ট্র্যাপ সিএসএসে রয়েছে:

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

আমি যখন max-widthফায়ারব্যাগ ব্যবহার করে সম্পত্তিটি অক্ষম করি তখন চিহ্নিতকারী চিত্রটি স্বাভাবিক হিসাবে উপস্থিত হয়। গুগল ম্যাপের চিত্রগুলিকে প্রভাবিত করা থেকে আমি কীভাবে বুটস্ট্র্যাপ সিএসএসকে আটকাতে পারি?

Comments

এখানে উত্তর দিন: github.com/zurb/foundation/issues/26

— রাক্লোস

Answer 1

বুটস্ট্র্যাপ ২.০ সহ, এটি কৌশলটি মনে হয়েছে:

#mapCanvas img {
  max-width: none;
}

Comments

#mapCanvas img { width: auto; display:inline; }@ নোড্রোগ

— জেএলবি

বুটস্ট্র্যাপ ২.০.৩ রিলিজ নোট থেকে: "প্রতিক্রিয়াশীল চিত্রগুলিতে ফিক্সড রিগ্রেশন ২.০.১ হিসাবে সমর্থন করে default গুগল ম্যাপস ইন্টিগ্রেশন এবং অন্যান্য প্রকল্পগুলি সম্পর্কে অভিযোগ, তবে আমরা এখন এই বিষয়গুলিতে আলাদা অবস্থান নিয়েছি এবং ডেভেলপারদের তাদের শেষ পর্যন্ত এই টুইটগুলি করার প্রয়োজন হবে। "

— কেভিনওয়ারমার্ট

এফওয়াইআই: বুটস্ট্র্যাপ ২.০.৪ রিলিজ নোটগুলি: "গুগল ম্যাপের রেন্ডারিংয়ের চিত্রগুলিতে গণ্ডগোল থেকে চিত্রগুলিতে সর্বাধিক প্রস্থ: 100% প্রতিরোধের জন্য বিশেষ সিএসএস যুক্ত করা হয়েছে।"

— কেভিনওয়ারমার্ট

এটি আশ্চর্যের বিষয় যে তারা শেষ পর্যন্ত আইডি হার্ডকোড করার সিদ্ধান্ত নিয়েছে, পরিবর্তে ক্লাস ব্যবহার করবে না

— জের্কम्स

# ম্যাপক্যানভাস আমার পক্ষে কাজ করেনি। আমি আমার। ম্যাপ ক্লাসটি ব্যবহার করেছি যা আমি গুগল ম্যাপস ধারক হিসাবে ব্যবহার করেছি এবং এটি কৌশলটি করেছে it ধন্যবাদ!

— ফাইডো

Answer 2

ভূখণ্ড এবং ওভারলেগুলির জন্য ড্রপডাউন নির্বাচনকারীদের সাথেও একটি সমস্যা রয়েছে, এটি উভয়ই যুক্ত করলে সমস্যাগুলি ঠিক হয়ে যাবে ...

#mapCanvas img { 
  max-width: none;
}

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

দ্বিতীয় স্টাইলটি কিছু ব্রাউজারে ভূখণ্ড এবং ওভারলে বক্স সহ অন্যান্য সমস্যাগুলি সাজিয়ে তুলবে।

Comments

হ্যাঁ ! উপরের "স্বীকৃত" হিসাবে চিহ্নিত উত্তরের সাথে মিলিয়ে এটির সাথে সবকিছু ঠিক হয়ে গেছে seems ধন্যবাদ।

— মাদুর

ফায়ারফক্স 17 একটি যাদুমন্ত্র মত কিন্তু কাজ না ক্রোম 23 কেন জানি না কিন্তু আমি সমাধান শুধু এই অ্যাড পাওয়া যায়:$('.map').on('shown',function(){ google.maps.event.trigger(map, 'resize'); });

— yosafatade

তুমি একজন প্রতিভাবান. অনেক ধন্যবাদ. এই ড্রাইভিং ছিল আমাকে উন্মাদ :-)

— বিয়ার

Answer 3

আপনার মানচিত্রটি ক্যানভাস ডিভির একটি আইডি দিন map_canvas ।

এই বুটস্ট্র্যাপ কমিটে আইডিটিরmax-width: none ফিক্স অন্তর্ভুক্ত রয়েছে map_canvas(তবে এটি কার্যকর হবে না mapCanvas)।

Comments

আমি মনে করি কেবল আইডি পরিবর্তন করতে v2.2.2

— জ্যাকট্রেডস

আমি সিএসএস ফাইলে এ জাতীয় আইডিটি খুঁজে

— পাই না

@ আরবিডি: কেবল কৌতূহলের জন্য, কেন এটি মানচিত্র_ক্যানভাস ছাড়া কাজ করবে না।

— অরুণরাজ

@ অরুনরাজ কারণ বুটস্ট্র্যাপে ফিক্সটি # ম্যাপ_ক্যানভাস আইডিটিতে হার্ডকড করা আছে (লিঙ্কযুক্ত প্রতিশ্রুতি দেখুন)। যাই হোক না কেন, উত্তরটি এখন প্রায় পুরানো হয়ে গেছে যে এটি প্রায় 2 বছরের পুরানো।

— ছিনতাই

Answer 4

এই উত্তরগুলির কোনওটিই আমার পক্ষে কাজ করেনি, তাই আমি আমার ডিভিতে গিয়ে তার শিশুদের দিকে তাকালাম "জিএম-স্টাইল" ক্লাস সহ একটি নতুন ডিভ দেখেছি, তাই আমি এটি আমার সিএসএসে রেখেছি:

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

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

.. এবং এটি আমার জন্য সমস্যার সমাধান করেছে।

Comments

+1 এই একমাত্র উত্তর যা আমার পক্ষে অদ্ভুত "জুম" নিয়ন্ত্রণগুলি ঠিক করার জন্য কাজ করেছিল। (বুটস্ট্র্যাপ 2)

— ফিলিফ্রেও

আমার জন্যও কাজ করেছেন। শুভ দৃষ্টিতে :)

— jeje

ধন্যবাদ, আমার জন্যও কাজ করেছেন। একমাত্র উত্তর যা আমার পক্ষে অদ্ভুত "জুম" নিয়ন্ত্রণগুলি ঠিক করতে কাজ করেছিল। (ফাউন্ডেশন 5 সহ)

— স্টেফি

Answer 5

আপনি সর্বাধিক প্রস্থ ব্যবহার করে সিএসএস বিভাগে সর্বাধিক প্রস্থের নিয়মকে ওভার রাইড করতে চান: কোনওটি নয়; এটি এই সমস্যার আশপাশের উপায় বলে মনে হচ্ছে

Answer 6

#MapCanvas পরিবর্তন করা gmap4rails রত্ন ব্যবহার করে আমাদের পক্ষে কাজ করে নি, তবে যখন আমরা পরিবর্তিত হয়েছিলাম did

.map_container img {
    max-width: none;
}

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

Answer 7

আমি gmaps4rails ব্যবহার করছি, এই ফিক্সটি আমার জন্য এটি করেছে:

.gmaps4rails_map img {
    max-width: none;
}
.gmaps4rails_map label {
    width: auto; display:inline;
}

Answer 8

সর্বশেষতম টুইটার বুটস্ট্র্যাপ 2.0.4 সরাসরি এই ফিক্স অন্তর্ভুক্ত।

আপনি যদি টুইটার বুটস্ট্র্যাপের ডেমো পৃষ্ঠার মতো একটি (ডিভ ক্লাস = "ধারক") এ আপনার সামগ্রী আবদ্ধ করেন তবে আপনার স্টাইল = "উচ্চতা: 100%" যুক্ত করা উচিত

Answer 9

যে কোনও ব্রাউজারে মুদ্রণ ব্যবহার করে মুদ্রণ মানচিত্র নিয়েও একটি সমস্যা রয়েছে। img { max-width: 100% !important; }: উপরের কোড দ্বারা নির্ধারিত করা হইনি আপনি একটি যোগ করতে হবে !importantতাই মত ঘোষণা:

@media print {
  img {
    max-width: auto !important;
  }
}

Answer 10

আমাকে বাক্স-ছায়াও বন্ধ করতে হয়েছিল এবং আমার অন্তর্ভুক্তির ক্রমের কারণে আমি! গুরুত্বপূর্ণ পতাকাটি যুক্ত করেছি।

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

Comments

এটি আমার পক্ষে কাজ করেছে। আপনি যদি কাউকে ভোট দিতে চান, তবে কমপক্ষে কেন তা বলা উচিত।

— রেডটোপিয়া

Answer 11

সমস্ত উত্তর সর্বাধিক প্রশস্ত ছিল: কোন

আমার জন্য, সর্বোচ্চ-উচ্চতা: উত্তরাধিকারী কাজ করেছে .....

লোকেরা # ম্যাপ, # ম্যাপ_ক্যানভাস ইত্যাদি ব্যবহার করছে আপনার পিতামাতার ডিভিটি দেখুন। যদি এটি নীল হয় তবে এটি # ব্লু আইএমজি than than