Skip to content

Commit bfda156

Browse files
committed
alt fix to twbs#10278: Change Google Maps compatibility warning to a general box-sizing warning
1 parent 26727bf commit bfda156

File tree

1 file changed

+7
-13
lines changed

1 file changed

+7
-13
lines changed

getting-started.html

+7-13
Original file line numberDiff line numberDiff line change
@@ -719,23 +719,17 @@ <h1 id="third-parties">Third party support</h1>
719719
</div>
720720
<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>
721721

722-
<h3>Google Maps</h3>
723-
<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>
722+
<h3>Box-sizing</h3>
723+
<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>
724724
{% highlight css %}
725-
/* Fix Google Maps canvas
725+
/* Box-sizing reset
726726
*
727-
* Wrap your Google Maps embed in a `.google-map-canvas` to reset Bootstrap's
728-
* global `box-sizing` changes. You may optionally need to reset the `max-width`
729-
* on images in case you've applied that anywhere else. (That shouldn't be as
730-
* necessary with Bootstrap 3 though as that behavior is relegated to the
731-
* `.img-responsive` class.)
727+
* Wrap your third party code in a `.reset-box-sizing` to override Bootstrap's
728+
* global `box-sizing` changes.
732729
*/
733730

734-
.google-map-canvas,
735-
.google-map-canvas * { .box-sizing(content-box); }
736-
737-
/* Optional responsive image override */
738-
img { max-width: none; }
731+
.reset-box-sizing,
732+
.reset-box-sizing * { .box-sizing(content-box); }
739733
{% endhighlight %}
740734
</div>
741735

0 commit comments

Comments
 (0)