Использование Google Maps API в iframe для предотвращения конфликтов CSS? - PullRequest
3 голосов
/ 11 сентября 2011

Есть ли простой способ использовать API Карт Google, чтобы карта отображалась в фрейме, а не в строке?Я хотел бы сделать это, потому что некоторые шаблоны WordPress имеют правила CSS, которые также применяются к элементам Google Maps , что дает странные результаты.Один пример с текущей темой по умолчанию: изображения в содержимом поста получают max-width, равный 97,5%, что дает следующие промежутки между плитками карты:

Google Maps with grey gaps between tiles

Предположим, это для плагинаэто будет использоваться в разных темах, поэтому я не могу контролировать базовый CSS.Я думаю, что есть три способа решить эту проблему:

  1. Добавить дополнительные правила CSS в мой плагин, которые сбрасывают все возможные базовые правила, которые могут конфликтовать (трудно сделать, в дикой природе так много странных настроек -max-width: 97.5% - это только один).
  2. Попросите Google добавить больше !important правил в свой CSS, чтобы предотвратить подобные конфликты (так же сложно, и Google, возможно, не захочет это делать)
  3. Просто поместите карту в iframe

Если у вас есть лучшее предложение по предотвращению этих конфликтов, я бы хотел их знать.

1 Ответ

0 голосов
/ 11 сентября 2011

Это так же просто, как поместить карту в iframe, установить размер iframe равным размеру карты и удалить границу iframe с помощью frameborder=0


Редактировать: Вам также придется удалитьотступы / поля на странице карты.

map_page.html

html, body { margin: 0, padding: 0 }
...