Использование API Карт Google в iframe для предотвращения конфликтов CSS?

Question

Есть ли простой способ использовать API Карт Google, чтобы карта отображалась в iframe, а не внутри? Я хотел бы сделать это, потому что some WordPress templates have CSS rules that are applied to the Google Maps elements too, давая странные результаты. Одним из примеров с текущей темой по умолчанию: изображения в посте содержания получить max-width 97,5%, что дает эти зазоры между тайлами:

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

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

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

Answer 1

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

---

Edit: Вы также должны удалить обивка/край на странице карты.

map_page.html

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