aboutsummaryrefslogtreecommitdiff
path: root/getting-started.html
diff options
context:
space:
mode:
authorMark Otto <[email protected]>2013-09-01 23:32:35 +0200
committerMark Otto <[email protected]>2013-09-01 23:32:35 +0200
commitbfda156bb95c115ac9abba880074d4582c81dc0d (patch)
treec89dd8c03738310927d1a12ed4b0b81bbc3b9186 /getting-started.html
parent26727bfefd46059a6ce66be7ed0e54910870efd9 (diff)
downloadbootstrap-bfda156bb95c115ac9abba880074d4582c81dc0d.tar.xz
bootstrap-bfda156bb95c115ac9abba880074d4582c81dc0d.zip
alt fix to #10278: Change Google Maps compatibility warning to a general box-sizing warning
Diffstat (limited to 'getting-started.html')
-rw-r--r--getting-started.html20
1 files changed, 7 insertions, 13 deletions
diff --git a/getting-started.html b/getting-started.html
index 1c864676b..b8a405ce4 100644
--- a/getting-started.html
+++ b/getting-started.html
@@ -719,23 +719,17 @@ if (navigator.userAgent.match(/IEMobile\/10\.0/)) {
</div>
<p class="lead">While we don't officially support any third party plugins or add-ons, we do offer some useful advice to help avoid potential issues in your projects.</p>
- <h3>Google Maps</h3>
- <p>If you're using Google Maps on a Bootstrapped project, you might run into some display problems due to our use of <code>* { box-sizing: border-box; }</code>. Previously, you may have also ran into issues with the use of <code>max-width</code> on images. The following snippet should avoid all those problems.</p>
+ <h3>Box-sizing</h3>
+ <p>Certain third party tools—such as Google Maps—have trouble working out of the box with Bootstrap due to our use of <code>* { box-sizing: border-box; }</code>. Use the following snippet to override it when necessary.</p>
{% highlight css %}
-/* Fix Google Maps canvas
+/* Box-sizing reset
*
- * Wrap your Google Maps embed in a `.google-map-canvas` to reset Bootstrap's
- * global `box-sizing` changes. You may optionally need to reset the `max-width`
- * on images in case you've applied that anywhere else. (That shouldn't be as
- * necessary with Bootstrap 3 though as that behavior is relegated to the
- * `.img-responsive` class.)
+ * Wrap your third party code in a `.reset-box-sizing` to override Bootstrap's
+ * global `box-sizing` changes.
*/
-.google-map-canvas,
-.google-map-canvas * { .box-sizing(content-box); }
-
-/* Optional responsive image override */
-img { max-width: none; }
+.reset-box-sizing,
+.reset-box-sizing * { .box-sizing(content-box); }
{% endhighlight %}
</div>