diff options
| author | Chris Rebert <[email protected]> | 2015-10-30 01:45:15 -0700 |
|---|---|---|
| committer | Chris Rebert <[email protected]> | 2015-10-30 01:45:15 -0700 |
| commit | a36740860819afce09854f5ddbe175a2028edf8d (patch) | |
| tree | ee8ef3997a0aaf6c3c4952ccef62db1700b66de6 /docs/_includes/components | |
| parent | 04d1b1fb490489ff5cd6cdeb27dad2c3e5365304 (diff) | |
| parent | 6e1e77b53991aead6bcf1d29d58eaeea7615a689 (diff) | |
| download | bootstrap-a36740860819afce09854f5ddbe175a2028edf8d.tar.xz bootstrap-a36740860819afce09854f5ddbe175a2028edf8d.zip | |
Merge pull request #18080 from twbs/csp-progress
Add docs regarding .progress, inline style attrs, and CSP
Diffstat (limited to 'docs/_includes/components')
| -rw-r--r-- | docs/_includes/components/progress-bars.html | 5 |
1 files changed, 5 insertions, 0 deletions
diff --git a/docs/_includes/components/progress-bars.html b/docs/_includes/components/progress-bars.html index e8ea1beed..13b76539a 100644 --- a/docs/_includes/components/progress-bars.html +++ b/docs/_includes/components/progress-bars.html @@ -8,6 +8,11 @@ <p>Progress bars use CSS3 transitions and animations to achieve some of their effects. These features are not supported in Internet Explorer 9 and below or older versions of Firefox. Opera 12 does not support animations.</p> </div> + <div class="bs-callout bs-callout-info"> + <h4 id="callout-progress-csp">Content Security Policy (CSP) compatibility</h4> + <p>If your website has a <a href="https://developer.mozilla.org/en-US/docs/Web/Security/CSP">Content Security Policy (CSP)</a> which doesn't allow <code>style-src 'unsafe-inline'</code>, then you won't be able to use inline <code>style</code> attributes to set progress bar widths as shown in our examples below. Alternative methods for setting the widths that are compatible with strict CSPs include using a little custom JavaScript (that sets <code>element.style.width</code>) or using custom CSS classes.</p> + </div> + <h2 id="progress-basic">Basic example</h2> <p>Default progress bar.</p> <div class="bs-example" data-example-id="simple-progress-bar"> |