diff --git a/packages/react-bootstrap-table2-example/examples/sticky-header/customized-style.js b/packages/react-bootstrap-table2-example/examples/sticky-header/customized-style.js
new file mode 100644
index 0000000..9b3460d
--- /dev/null
+++ b/packages/react-bootstrap-table2-example/examples/sticky-header/customized-style.js
@@ -0,0 +1,55 @@
+import React from 'react';
+
+import BootstrapTable from 'react-bootstrap-table-next';
+import Code from 'components/common/code-block';
+import { productsGenerator } from 'utils/common';
+
+const products = productsGenerator(87);
+
+const columns = [{
+ dataField: 'id',
+ text: 'Product ID'
+}, {
+ dataField: 'name',
+ text: 'Product Name'
+}, {
+ dataField: 'price',
+ text: 'Product Price'
+}];
+
+const style = `\
+// Customizing your own sticky table style by simply overwriting .table-sticky
+.react-bootstrap-table {
+ .sticky.table-sticky {
+ tbody {
+ max-height: 200px;
+ }
+ }
+}
+`;
+
+const sourceCode = `\
+import BootstrapTable from 'react-bootstrap-table-next';
+
+const columns = [{
+ dataField: 'id',
+ text: 'Product ID'
+}, {
+ dataField: 'name',
+ text: 'Product Name'
+}, {
+ dataField: 'price',
+ text: 'Product Price'
+}];
+
+
+`;
+
+export default () => (
+
+
+
+ { style }
+ { sourceCode }
+
+);
diff --git a/packages/react-bootstrap-table2-example/stories/index.js b/packages/react-bootstrap-table2-example/stories/index.js
index 6502e78..9a5930a 100644
--- a/packages/react-bootstrap-table2-example/stories/index.js
+++ b/packages/react-bootstrap-table2-example/stories/index.js
@@ -170,6 +170,7 @@ import TableOverlay from 'examples/loading-overlay/table-overlay';
// sticky header table
import StickyHeaderTable from 'examples/sticky-header/default';
+import StickyHeaderCustomStyleTable from 'examples/sticky-header/customized-style.js';
// remote
import RemoteSort from 'examples/remote/remote-sort';
@@ -367,7 +368,8 @@ storiesOf('Export CSV', module)
storiesOf('Sticky header', module)
.addDecorator(bootstrapStyle())
- .add('Default sticky header', () => );
+ .add('Default sticky header', () => )
+ .add('Custom style for sticky header', () => );
storiesOf('EmptyTableOverlay', module)
.addDecorator(bootstrapStyle())
diff --git a/packages/react-bootstrap-table2-example/stories/stylesheet/sticky/_index.scss b/packages/react-bootstrap-table2-example/stories/stylesheet/sticky/_index.scss
new file mode 100644
index 0000000..2ccb57d
--- /dev/null
+++ b/packages/react-bootstrap-table2-example/stories/stylesheet/sticky/_index.scss
@@ -0,0 +1,7 @@
+.react-bootstrap-table {
+ .sticky.table-sticky {
+ tbody {
+ max-height: 200px;
+ }
+ }
+}
diff --git a/packages/react-bootstrap-table2-example/stories/stylesheet/storybook.scss b/packages/react-bootstrap-table2-example/stories/stylesheet/storybook.scss
index 14959a6..d40ff8e 100644
--- a/packages/react-bootstrap-table2-example/stories/stylesheet/storybook.scss
+++ b/packages/react-bootstrap-table2-example/stories/stylesheet/storybook.scss
@@ -12,3 +12,4 @@
@import "sort/index";
@import "search/index";
@import "loading-overlay/index";
+@import "sticky/index";