Arrange example updates

cerner · Jul 7, 2023 · 0a9be2d · 0a9be2d
1 parent a7a7317
commit 0a9be2d
Show file tree

Hide file tree

Showing 3 changed files with 7 additions and 6 deletions.
diff --git a/packages/terra-core-docs/src/terra-dev-site/doc/arrange/common/examplesetup.jsx b/packages/terra-core-docs/src/terra-dev-site/doc/arrange/common/examplesetup.jsx
@@ -5,15 +5,15 @@ import styles from './examplesetup.scss';
 const cx = classNames.bind(styles);
 
 const ipsum = 'This example provides content containers with a fit (start and/or end region) and fill (middle region). Arrange Props have one required prop which is fill to the content to display in the body of the fill.';
-const simpleText = <div>{ipsum}</div>;
-const textWithBlueBorder = <div className={cx('outlined-placeholder')}>{ipsum}</div>;
+const simpleText = <span>{ipsum}</span>;
+const textWithBlueBorder = <span className={cx('outlined-placeholder')}>{ipsum}</span>;
 
 const alignExampleDiv = (
-  <div className={cx('placeholder')} />
+  <span className={cx('placeholder')} />
 );
 
 const alignExampleDivBlue = (
-  <div className={cx('highlighted-placeholder')} />
+  <span className={cx('highlighted-placeholder')} />
 );
 
 export {

diff --git a/packages/terra-core-docs/src/terra-dev-site/doc/arrange/common/examplesetup.scss b/packages/terra-core-docs/src/terra-dev-site/doc/arrange/common/examplesetup.scss
@@ -10,6 +10,7 @@
 
   .outlined-placeholder {
     border: 2px solid #0079be;
+    display: block;
   }
 
   .placeholder {

diff --git a/packages/terra-section-header/src/SectionHeader.jsx b/packages/terra-section-header/src/SectionHeader.jsx
@@ -171,9 +171,9 @@ class SectionHeader extends React.Component {
             <ArrangeComponent />
           </button>
         ) : (
-          <div tabIndex="-1" className={cx('arrange-wrapper')}>
+          <span tabIndex="-1" className={cx('arrange-wrapper')}>
             <ArrangeComponent />
-          </div>
+          </span>
         )}
       </Element>
     );