aboutsummaryrefslogtreecommitdiff
path: root/docs/content
diff options
context:
space:
mode:
Diffstat (limited to 'docs/content')
-rw-r--r--docs/content/forms.md6
-rw-r--r--docs/content/tables.md5
-rw-r--r--docs/content/typography.md8
3 files changed, 14 insertions, 5 deletions
diff --git a/docs/content/forms.md b/docs/content/forms.md
index 7d274c2a0..1cf1e9c8e 100644
--- a/docs/content/forms.md
+++ b/docs/content/forms.md
@@ -236,6 +236,8 @@ Should you have no text within the `<label>`, the input is positioned as you'd e
### Selects
+Note that many native select menus—namely in Safari and Chrome—have rounded corners that cannot be modified via `border-radius` properties.
+
Use the default option, or add `multiple` to show multiple options at once.
{% example html %}
@@ -246,7 +248,11 @@ Use the default option, or add `multiple` to show multiple options at once.
<option>4</option>
<option>5</option>
</select>
+{% endexample %}
+For `<select>` controls with the `multiple` attribute, multiple options are shown by default.
+
+{% example html %}
<select multiple class="form-control">
<option>1</option>
<option>2</option>
diff --git a/docs/content/tables.md b/docs/content/tables.md
index e4f69b068..f8d743044 100644
--- a/docs/content/tables.md
+++ b/docs/content/tables.md
@@ -433,6 +433,11 @@ Use contextual classes to color table rows or individual cells.
Create responsive tables by wrapping any `.table` in `.table-responsive` to make them scroll horizontally on small devices (under 768px). When viewing on anything larger than 768px wide, you will not see any difference in these tables.
+<div class="bs-callout bs-callout-warning" id="callout-tables-responsive-overflow">
+ <h4>Vertical clipping/truncation</h4>
+ <p>Responsive tables make use of <code>overflow-y: hidden</code>, which clips off any content that goes beyond the bottom or top edges of the table. In particular, this can clip off dropdown menus and other third-party widgets.</p>
+</div>
+
<div class="bs-callout bs-callout-warning">
<h4>Firefox and fieldsets</h4>
<p>Firefox has some awkward fieldset styling involving <code>width</code> that interferes with the responsive table. This cannot be overriden without a Firefox-specific hack that we <strong>don't</strong> provide in Bootstrap:</p>
diff --git a/docs/content/typography.md b/docs/content/typography.md
index 43f87cbde..df4f9a9f7 100644
--- a/docs/content/typography.md
+++ b/docs/content/typography.md
@@ -160,12 +160,10 @@ Transform text in components with text capitalization classes.
## Abbreviations
-Stylized implementation of HTML's `<abbr>` element for abbreviations and acronyms to show the expanded version on hover. Abbreviations with a `title` attribute have a light dotted bottom border and a help cursor on hover, providing additional context on hover.
+Stylized implementation of HTML's `<abbr>` element for abbreviations and acronyms to show the expanded version on hover. Abbreviations with a `title` attribute have a light dotted bottom border and a help cursor on hover, providing additional context on hover and to users of assistive technologies.
### Basic abbreviation
-For expanded text on long hover of an abbreviation, include the `title` attribute with the `<abbr>` element.
-
{% example html %}
<abbr title="attribute">attr</abbr>
{% endexample %}
@@ -344,10 +342,10 @@ Align terms and descriptions horizontally by using our grid system's predefined
<dt class="col-sm-3">Euismod</dt>
<dd class="col-sm-9">Vestibulum id ligula porta felis euismod semper eget lacinia odio sem nec elit.</dd>
<dd class="col-sm-9 col-sm-offset-3">Donec id elit non mi porta gravida at eget metus.</dd>
-
+
<dt class="col-sm-3">Malesuada porta</dt>
<dd class="col-sm-9">Etiam porta sem malesuada magna mollis euismod.</dd>
-
+
<dt class="col-sm-3 text-truncate">Truncated term is truncated</dt>
<dd class="col-sm-9">Fusce dapibus, tellus ac cursus commodo, tortor mauris condimentum nibh, ut fermentum massa justo sit amet risus.</dd>
</dl>