diff --git a/packages/page-explorer/src/BlockInfo/ByHash.tsx b/packages/page-explorer/src/BlockInfo/ByHash.tsx
index c1465f0f65..420f0eeece 100644
--- a/packages/page-explorer/src/BlockInfo/ByHash.tsx
+++ b/packages/page-explorer/src/BlockInfo/ByHash.tsx
@@ -103,9 +103,9 @@ function BlockByHash ({ className = '', error, value }: Props): React.ReactEleme
         [formatNumber(getHeader.number.unwrap()), 'start', 1],
         [t('hash'), 'start'],
         [t('parent'), 'start'],
-        [t('extrinsics'), 'start media--1000'],
-        [t('state'), 'start media--1100'],
-        [runtimeVersion ? `${runtimeVersion.specName.toString()}/${runtimeVersion.specVersion.toString()}` : undefined, 'media--1200']
+        [t('extrinsics'), 'start media--1300'],
+        [t('state'), 'start media--1200'],
+        [runtimeVersion ? `${runtimeVersion.specName.toString()}/${runtimeVersion.specVersion.toString()}` : undefined, 'media--1000']
       ]
       : EMPTY_HEADER,
     [getHeader, runtimeVersion, t]
@@ -122,10 +122,7 @@ function BlockByHash ({ className = '', error, value }: Props): React.ReactEleme
         maxBlockWeight={maxBlockWeight}
         signedBlock={getBlock}
       />
-      <Table
-        header={header}
-        isFixed
-      >
+      <Table header={header}>
         {blkError
           ? <tr><td colSpan={6}>{t('Unable to retrieve the specified block details. {{error}}', { replace: { error: blkError.message } })}</td></tr>
           : getBlock && getHeader && !getBlock.isEmpty && !getHeader.isEmpty && (
@@ -141,9 +138,9 @@ function BlockByHash ({ className = '', error, value }: Props): React.ReactEleme
                   ? <Link to={`/explorer/query/${parentHash || ''}`}>{parentHash}</Link>
                   : parentHash
               }</td>
-              <td className='hash overflow media--1000'>{getHeader.extrinsicsRoot.toHex()}</td>
-              <td className='hash overflow media--1100'>{getHeader.stateRoot.toHex()}</td>
-              <td className='media--1200'>
+              <td className='hash overflow media--1300'>{getHeader.extrinsicsRoot.toHex()}</td>
+              <td className='hash overflow media--1200'>{getHeader.stateRoot.toHex()}</td>
+              <td className='media--1000'>
                 <LinkExternal
                   data={value}
                   type='block'
diff --git a/packages/react-components/src/Table/Table.tsx b/packages/react-components/src/Table/Table.tsx
index d174394d20..55a7087907 100644
--- a/packages/react-components/src/Table/Table.tsx
+++ b/packages/react-components/src/Table/Table.tsx
@@ -287,6 +287,9 @@ export default React.memo(styled(Table)`
 
       &.hash {
         font: var(--font-mono);
+        // we actually want to use 10ch here, however in the
+        // block expand page gives different sizes to the hashes
+        min-width: 7.5rem;
       }
 
       &.links {