diff --git a/embark-ui/src/components/Accounts.js b/embark-ui/src/components/Accounts.js
index eb0116cf..36aea7be 100644
--- a/embark-ui/src/components/Accounts.js
+++ b/embark-ui/src/components/Accounts.js
@@ -8,32 +8,34 @@ import CardTitleIdenticon from './CardTitleIdenticon';
 const Accounts = ({accounts}) => (
   <Row>
     <Col>
-      <h1>Accounts</h1>
-      {accounts.map(account => (
-        <Card key={account.address}>
-          <CardHeader>
+      <Card>
+        <CardHeader>
+          <h2>Accounts</h2>
+        </CardHeader>
+        <CardBody>
+          {accounts.map(account => (
+            <div className="explorer-row border-top" key={account.address}>
               <CardTitleIdenticon id={account.address}>Account&nbsp;
                 <Link to={`/embark/explorer/accounts/${account.address}`}>{account.address}</Link>
               </CardTitleIdenticon>
-          </CardHeader>
-          <CardBody>
-            <Row>
-              <Col>
-                <strong>Balance</strong>
-                <div>{account.balance} Ether</div>
-              </Col>
-              <Col>
-                <strong>Tx Count</strong>
-                <div>{account.transactionCount}</div>
-              </Col>
-              <Col>
-                <strong>Index</strong>
-                <div>{account.index}</div>
-              </Col>
-            </Row>
-          </CardBody>
-        </Card>
-      ))}
+              <Row>
+                <Col>
+                  <strong>Balance</strong>
+                  <div>{account.balance} Ether</div>
+                </Col>
+                <Col>
+                  <strong>Tx Count</strong>
+                  <div>{account.transactionCount}</div>
+                </Col>
+                <Col>
+                  <strong>Index</strong>
+                  <div>{account.index}</div>
+                </Col>
+              </Row>
+            </div>
+          ))}
+        </CardBody>
+      </Card>
     </Col>
   </Row>
 );
diff --git a/embark-ui/src/components/Blocks.js b/embark-ui/src/components/Blocks.js
index 3ae9bb9e..ba27fbd0 100644
--- a/embark-ui/src/components/Blocks.js
+++ b/embark-ui/src/components/Blocks.js
@@ -4,48 +4,50 @@ import {Row, Col, Card, CardHeader, CardBody} from 'reactstrap';
 import PropTypes from 'prop-types';
 
 import CardTitleIdenticon from './CardTitleIdenticon';
+import LoadMore from "./LoadMore";
 
-const Blocks = ({blocks}) => (
+const Blocks = ({blocks, showLoadMore, loadMore}) => (
   <Row>
     <Col>
-      <h1>Blocks</h1>
-      {blocks.map(block => (
-        <Card key={block.number}>
-          <CardHeader>
-            <CardTitleIdenticon id={block.hash}>Block&nbsp;
-              <Link to={`/embark/explorer/blocks/${block.number}`}>
-                {block.number}
-              </Link>
-            </CardTitleIdenticon>
-          </CardHeader>
-          <CardBody>
-            <Row>
-              <Col>
-                <strong>Number</strong>
-                <div>{block.number}</div>
-              </Col>
-              <Col>
-                <strong>Mined On</strong>
-                <div>{new Date(block.timestamp * 1000).toLocaleString()}</div>
-              </Col>
-              <Col>
-                <strong>Gas Used</strong>
-                <div>{block.gasUsed}</div>
-              </Col>
-              <Col>
-                <strong>TX Count</strong>
-                <div>{block.transactions.length}</div>
-              </Col>
-            </Row>
-          </CardBody>
-        </Card>
-      ))}
+      <Card>
+        <CardHeader>
+          <h2>Blocks</h2>
+        </CardHeader>
+        <CardBody>
+          {blocks.map(block => (
+            <div className="explorer-row border-top" key={block.number}>
+              <CardTitleIdenticon id={block.hash}>Block&nbsp;
+                <Link to={`/embark/explorer/blocks/${block.number}`}>
+                  {block.number}
+                </Link>
+              </CardTitleIdenticon>
+              <Row>
+                <Col>
+                  <strong>Mined On</strong>
+                  <div>{new Date(block.timestamp * 1000).toLocaleString()}</div>
+                </Col>
+                <Col>
+                  <strong>Gas Used</strong>
+                  <div>{block.gasUsed}</div>
+                </Col>
+                <Col>
+                  <strong>TX Count</strong>
+                  <div>{block.transactions.length}</div>
+                </Col>
+              </Row>
+            </div>
+          ))}
+          {showLoadMore && <LoadMore loadMore={() => loadMore()}/>}
+        </CardBody>
+      </Card>
     </Col>
   </Row>
 );
 
 Blocks.propTypes = {
-  blocks: PropTypes.arrayOf(PropTypes.object)
+  blocks: PropTypes.arrayOf(PropTypes.object),
+  showLoadMore: PropTypes.bool,
+  loadMore: PropTypes.func
 };
 
 export default Blocks;
diff --git a/embark-ui/src/components/CardTitleIdenticon.js b/embark-ui/src/components/CardTitleIdenticon.js
index e34d8886..f0576ff3 100644
--- a/embark-ui/src/components/CardTitleIdenticon.js
+++ b/embark-ui/src/components/CardTitleIdenticon.js
@@ -1,9 +1,20 @@
+import PropTypes from "prop-types";
 import React from 'react';
 import {CardTitle} from 'reactstrap';
 import Blockies from 'react-blockies';
 
 const CardTitleIdenticon = ({id, children}) => (
-  <CardTitle><Blockies seed={id} className="rounded"/><span className="ml-2 align-top">{children}</span></CardTitle>
-)
+  <CardTitle>
+    <Blockies seed={id} className="rounded"/><span className="ml-2 align-top text-truncate">{children}</span>
+  </CardTitle>
+);
 
-export default CardTitleIdenticon
+CardTitleIdenticon.propTypes = {
+  id: PropTypes.string,
+  children: PropTypes.oneOfType([
+    PropTypes.object,
+    PropTypes.array
+  ])
+};
+
+export default CardTitleIdenticon;
diff --git a/embark-ui/src/components/Explorer.css b/embark-ui/src/components/Explorer.css
new file mode 100644
index 00000000..80964c1f
--- /dev/null
+++ b/embark-ui/src/components/Explorer.css
@@ -0,0 +1,14 @@
+.explorer-row {
+  border-top-width: 0 !important; /*Bootstrap uses important, so we need to override it*/
+}
+
+.explorer-row + .explorer-row {
+  margin-top: 5px;
+  padding-top: 20px;
+  border-top-width: 1px !important;
+}
+
+.explorer-row .text-truncate {
+  width: 90%;
+  display: inline-block;
+}
diff --git a/embark-ui/src/components/ExplorerDashboardLayout.js b/embark-ui/src/components/ExplorerDashboardLayout.js
index 64a5e479..e510c1de 100644
--- a/embark-ui/src/components/ExplorerDashboardLayout.js
+++ b/embark-ui/src/components/ExplorerDashboardLayout.js
@@ -8,9 +8,11 @@ import AccountsContainer from '../containers/AccountsContainer';
 import BlocksContainer from '../containers/BlocksContainer';
 import TransactionsContainer from '../containers/TransactionsContainer';
 
+import './Explorer.css';
+
 const ExplorerDashboardLayout = () => (
   <React.Fragment>
-    <Row>
+    <Row className="mt-4">
       <Col>
         <AccountsContainer />
       </Col>
diff --git a/embark-ui/src/components/Transactions.js b/embark-ui/src/components/Transactions.js
index afe78984..1a80121f 100644
--- a/embark-ui/src/components/Transactions.js
+++ b/embark-ui/src/components/Transactions.js
@@ -4,48 +4,54 @@ import {Row, Col, Card, CardHeader, CardBody} from 'reactstrap';
 import PropTypes from 'prop-types';
 
 import CardTitleIdenticon from './CardTitleIdenticon';
+import LoadMore from "./LoadMore";
 
-const Transactions = ({transactions}) => (
+const Transactions = ({transactions, showLoadMore, loadMore}) => (
   <Row>
     <Col>
-      <h1>Transactions</h1>
-      {transactions.map(transaction => (
-        <Card key={transaction.hash}>
-          <CardHeader>
-            <CardTitleIdenticon id={transaction.hash}>Transaction&nbsp;
-              <Link to={`/embark/explorer/transactions/${transaction.hash}`}>
-                {transaction.hash}
-              </Link>
-            </CardTitleIdenticon>
-          </CardHeader>
-          <CardBody>
-            <Row>
-              <Col>
-                <strong>Block number</strong>
-                <div>{transaction.blockNumber}</div>
-              </Col>
-              <Col>
-                <strong>From</strong>
-                <div>{transaction.from}</div>
-              </Col>
-              <Col>
-                <strong>To</strong>
-                <div>{transaction.to}</div>
-              </Col>
-              <Col>
-                <strong>Type</strong>
-                <div>{transaction.to ? "Contract Call" : "Contract Creation"}</div>
-              </Col>
-            </Row>
-          </CardBody>
-        </Card>
-      ))}
+      <Card>
+        <CardHeader>
+          <h2>Transactions</h2>
+        </CardHeader>
+        <CardBody>
+          {transactions.map(transaction => (
+            <div className="explorer-row border-top" key={transaction.hash}>
+              <CardTitleIdenticon id={transaction.hash}>Transaction&nbsp;
+                <Link to={`/embark/explorer/transactions/${transaction.hash}`}>
+                  {transaction.hash}
+                </Link>
+              </CardTitleIdenticon>
+              <Row>
+                <Col md={6}>
+                  <strong>Block number</strong>
+                  <div>{transaction.blockNumber}</div>
+                </Col>
+                <Col md={6}>
+                  <strong>From</strong>
+                  <div>{transaction.from}</div>
+                </Col>
+                <Col md={6}>
+                  <strong>To</strong>
+                  <div>{transaction.to}</div>
+                </Col>
+                <Col md={6}>
+                  <strong>Type</strong>
+                  <div>{transaction.to ? "Contract Call" : "Contract Creation"}</div>
+                </Col>
+              </Row>
+            </div>
+          ))}
+          {showLoadMore && <LoadMore loadMore={() => loadMore()}/>}
+        </CardBody>
+      </Card>
     </Col>
   </Row>
 );
 
 Transactions.propTypes = {
-  transactions: PropTypes.arrayOf(PropTypes.object)
+  transactions: PropTypes.arrayOf(PropTypes.object),
+  showLoadMore: PropTypes.bool,
+  loadMore: PropTypes.func
 };
 
 export default Transactions;
diff --git a/embark-ui/src/containers/BlocksContainer.js b/embark-ui/src/containers/BlocksContainer.js
index 7420a01e..1163214f 100644
--- a/embark-ui/src/containers/BlocksContainer.js
+++ b/embark-ui/src/containers/BlocksContainer.js
@@ -5,7 +5,6 @@ import PropTypes from 'prop-types';
 import {blocks as blocksAction, initBlockHeader, stopBlockHeader} from '../actions';
 import Blocks from '../components/Blocks';
 import DataWrapper from "../components/DataWrapper";
-import LoadMore from "../components/LoadMore";
 import {getBlocks} from "../reducers/selectors";
 
 class BlocksContainer extends Component {
@@ -34,9 +33,8 @@ class BlocksContainer extends Component {
     return (
       <React.Fragment>
         <DataWrapper shouldRender={this.props.blocks.length > 0} {...this.props} render={({blocks}) => (
-          <Blocks blocks={blocks} />
+          <Blocks blocks={blocks} showLoadMore={(this.loadMoreFrom() >= 0)} loadMore={() => this.loadMore()} />
         )} />
-        {(this.loadMoreFrom() >= 0) ? <LoadMore loadMore={() => this.loadMore()} /> : <React.Fragment />}
       </React.Fragment>
     );
   }
diff --git a/embark-ui/src/containers/TransactionsContainer.js b/embark-ui/src/containers/TransactionsContainer.js
index b50807c3..861709b1 100644
--- a/embark-ui/src/containers/TransactionsContainer.js
+++ b/embark-ui/src/containers/TransactionsContainer.js
@@ -3,7 +3,6 @@ import {connect} from 'react-redux';
 import PropTypes from 'prop-types';
 
 import {transactions as transactionsAction, initBlockHeader, stopBlockHeader} from '../actions';
-import LoadMore from "../components/LoadMore";
 import Transactions from '../components/Transactions';
 import DataWrapper from "../components/DataWrapper";
 import {getTransactions} from "../reducers/selectors";
@@ -34,9 +33,9 @@ class TransactionsContainer extends Component {
     return (
       <React.Fragment>
         <DataWrapper shouldRender={this.props.transactions.length > 0} {...this.props} render={({transactions}) => (
-          <Transactions transactions={transactions} />
+          <Transactions transactions={transactions}
+                        showLoadMore={(this.loadMoreFrom() >= 0)} loadMore={() => this.loadMore()} />
         )} />
-        {(this.loadMoreFrom() > 0) ? <LoadMore loadMore={() => this.loadMore()} /> : <React.Fragment />}
       </React.Fragment>
     );
   }