diff --git a/src-docs/src/views/code/code_block_pre.js b/src-docs/src/views/code/code_block_pre.js
index baf324957f7..ec73c3b3b9e 100644
--- a/src-docs/src/views/code/code_block_pre.js
+++ b/src-docs/src/views/code/code_block_pre.js
@@ -20,9 +20,10 @@ export default () => (
paddingSize="m"
color="dark"
overflowHeight={300}
+ whiteSpace="pre"
isCopyable>
- When the whiteSpace property is set to pre all the whitespaces will be kept as is and the text only wraps when line breaks are in the content.
+ In this example, the whiteSpace property is set to pre. All the whitespaces will be kept as is and the text only wraps when line breaks are in the content.
diff --git a/src-docs/src/views/code/code_example.js b/src-docs/src/views/code/code_example.js
index 2a56e74b8e9..ac6520b9d4e 100644
--- a/src-docs/src/views/code/code_example.js
+++ b/src-docs/src/views/code/code_example.js
@@ -72,7 +72,7 @@ export const CodeExample = {
demo: ,
},
{
- title: 'CodeBlock with pre white space',
+ title: 'CodeBlock and white-space',
source: [
{
type: GuideSectionTypes.JS,
@@ -85,8 +85,11 @@ export const CodeExample = {
],
text: (
- EuiCodeBlock allows whiteSpace property to be set
- allowing user to breaks/white space forcefuly or not.
+ By default, the whiteSpace property is set to{' '}
+ pre-wrap. This makes the text wrap when needed. You
+ can, however, pass pre to the{' '}
+ whiteSpace prop and the text won't wrap unless
+ line breaks are in the content.
),
props: { EuiCodeBlockImpl },