diff --git a/__tests__/src/components/ThumbnailNavigation.test.js b/__tests__/src/components/ThumbnailNavigation.test.js
index fb31364882d8128d94f585812af8fb0b1899283c..4c10fb37c404b96d05dddf438dbcf61bedf88797 100644
--- a/__tests__/src/components/ThumbnailNavigation.test.js
+++ b/__tests__/src/components/ThumbnailNavigation.test.js
@@ -64,7 +64,7 @@ describe('ThumbnailNavigation', () => {
     expect(setCanvas).toHaveBeenCalledWith('foobar', 0);
   });
   it('sets up calculated width based off of height of area and dimensions of canvas', () => {
-    expect(renderedGrid.find('.mirador-thumbnail-nav-container').first().prop('style').width).toEqual(93);
+    expect(renderedGrid.find('.mirador-thumbnail-nav-container').first().prop('style').width).toEqual(90);
   });
   it('renders canvas thumbnails', () => {
     expect(renderedGrid.find('CanvasThumbnail').length).toBe(3);
@@ -108,7 +108,7 @@ describe('ThumbnailNavigation', () => {
     });
     it('style', () => {
       expect(wrapper.instance().style()).toMatchObject({ height: '150px', width: '100%' });
-      expect(rightWrapper.instance().style()).toMatchObject({ height: '100%', width: '122px' });
+      expect(rightWrapper.instance().style()).toMatchObject({ height: '100%', width: '131px' });
     });
     it('rightWidth', () => {
       expect(wrapper.instance().rightWidth()).toEqual(100);
@@ -125,12 +125,12 @@ describe('ThumbnailNavigation', () => {
       expect(wrapper.instance().rightWidth()).toEqual(200);
     });
     it('calculateScaledWidth', () => {
-      expect(wrapper.instance().calculateScaledWidth({ index: 0 })).toEqual(93);
+      expect(wrapper.instance().calculateScaledWidth({ index: 0 })).toEqual(90);
       expect(rightWrapper.instance().calculateScaledWidth({ index: 0 })).toEqual(100);
     });
     it('calculateScaledHeight', () => {
-      expect(wrapper.instance().calculateScaledHeight({ index: 0 })).toEqual(140);
-      expect(rightWrapper.instance().calculateScaledHeight({ index: 0 })).toEqual(132);
+      expect(wrapper.instance().calculateScaledHeight({ index: 0 })).toEqual(135);
+      expect(rightWrapper.instance().calculateScaledHeight({ index: 0 })).toEqual(126);
     });
 
     it('columnCount', () => {
diff --git a/src/components/ThumbnailNavigation.js b/src/components/ThumbnailNavigation.js
index 29e51540fe3180d187beaf0e6d6858e0afb44de3..459da0acd9236310ef7370cb139339fbf08fac22 100644
--- a/src/components/ThumbnailNavigation.js
+++ b/src/components/ThumbnailNavigation.js
@@ -21,7 +21,7 @@ export class ThumbnailNavigation extends Component {
   constructor(props) {
     super(props);
 
-    this.scrollbarSize = 10;
+    this.scrollbarSize = 15;
     this.spacing = 16; // 2 * (2px margin + 2px border + 2px padding + 2px padding)
     this.cellRenderer = this.cellRenderer.bind(this);
     this.calculateScaledHeight = this.calculateScaledHeight.bind(this);