diff options
Diffstat (limited to 'docs/components')
| -rw-r--r-- | docs/components/badge.md | 2 | ||||
| -rw-r--r-- | docs/components/collapse.md | 2 | ||||
| -rw-r--r-- | docs/components/forms.md | 4 | ||||
| -rw-r--r-- | docs/components/modal.md | 6 |
4 files changed, 7 insertions, 7 deletions
diff --git a/docs/components/badge.md b/docs/components/badge.md index 896c917f3..a7497a285 100644 --- a/docs/components/badge.md +++ b/docs/components/badge.md @@ -1,7 +1,7 @@ --- layout: docs title: Badges -description: Documentation and examples for badges, our small count and labelling component. +description: Documentation and examples for badges, our small count and labeling component. group: components --- diff --git a/docs/components/collapse.md b/docs/components/collapse.md index c269bb382..8942c85a4 100644 --- a/docs/components/collapse.md +++ b/docs/components/collapse.md @@ -40,7 +40,7 @@ You can use a link with the `href` attribute, or a button with the `data-target` ## Accordion example -Using the [card]({{ site.baseurl }}/components/card) component, you can extend the default collapse behavior to create an accordion. +Using the [card]({{ site.baseurl }}/components/card/) component, you can extend the default collapse behavior to create an accordion. {% example html %} <div id="accordion" role="tablist"> diff --git a/docs/components/forms.md b/docs/components/forms.md index 17a96a113..88740acfc 100644 --- a/docs/components/forms.md +++ b/docs/components/forms.md @@ -261,11 +261,11 @@ The `.form-group` class is the easiest way to add some structure to forms. Its o {% example html %} <form> <div class="form-group"> - <label for="formGroupExampleInput">Example label</label> + <label class="form-control-label" for="formGroupExampleInput">Example label</label> <input type="text" class="form-control" id="formGroupExampleInput" placeholder="Example input"> </div> <div class="form-group"> - <label for="formGroupExampleInput2">Another label</label> + <label class="form-control-label" for="formGroupExampleInput2">Another label</label> <input type="text" class="form-control" id="formGroupExampleInput2" placeholder="Another input"> </div> </form> diff --git a/docs/components/modal.md b/docs/components/modal.md index 16689f6ae..deb25c4dc 100644 --- a/docs/components/modal.md +++ b/docs/components/modal.md @@ -20,8 +20,8 @@ Before getting started with Bootstrap's modal component, be sure to read the fol - Clicking on the modal "backdrop" will automatically close the modal. - Bootstrap only supports one modal window at a time. Nested modals aren't supported as we believe them to be poor user experiences. - Modals use `position: fixed`, which can sometimes be a bit particular about its rendering. Whenever possible, place your modal HTML in a top-level position to avoid potential interference from other elements. You'll likely run into issues when nesting a `.modal` within another fixed element. -- One again, due to `position: fixed`, there are some caveats with using modals on mobile devices. [See our browser support docs]({{ site.baseurl }}/getting-started/browsers-devices/#modals-and-dropdowns-on-mobile) for details. -- Lastly, the `autofocus` HTML attribute has no affect in modals. Here's how you can achieve the same effect with custom JavaScript. +- Once again, due to `position: fixed`, there are some caveats with using modals on mobile devices. [See our browser support docs]({{ site.baseurl }}/getting-started/browsers-devices/#modals-and-dropdowns-on-mobile) for details. +- Lastly, the `autofocus` HTML attribute has no effect in modals. Here's how you can achieve the same effect with custom JavaScript. Keep reading for demos and usage guidelines. @@ -347,7 +347,7 @@ Utilize the Bootstrap grid system within a modal by nesting `.container-fluid` w ### Varying modal content -Have a bunch of buttons that all trigger the same modal with slightly different contents? Use `event.relatedTarget` and [HTML `data-*` attributes](https://developer.mozilla.org/en-US/docs/Web/Guide/HTML/Using_data_attributes) (possibly [via jQuery](https://api.jquery.com/data/)) to vary the contents of the modal depending on which button was clicked. +Have a bunch of buttons that all trigger the same modal with slightly different contents? Use `event.relatedTarget` and [HTML `data-*` attributes](https://developer.mozilla.org/en-US/docs/Learn/HTML/Howto/Use_data_attributes) (possibly [via jQuery](https://api.jquery.com/data/)) to vary the contents of the modal depending on which button was clicked. Below is a live demo followed by example HTML and JavaScript. For more information, [read the modal events docs](#events) for details on `relatedTarget`. |