diff --git a/src/web/viewlets/canvas/graph-canvas.js b/src/web/viewlets/canvas/graph-canvas.js
index 7d6ba4d..4bc5a7b 100644
--- a/src/web/viewlets/canvas/graph-canvas.js
+++ b/src/web/viewlets/canvas/graph-canvas.js
@@ -661,7 +661,8 @@ export default class GraphCanvas extends DefaultRemoteComponent {
                         <div className={" position-absolute "}
                              style={{
                                  "width": "420px", "top": "90px", "zIndex": 100001,
-                                 "maxHeight": "calc(100vh - 140px)"
+                                 // "maxHeight": "calc(100vh - 140px)",
+                                 // "overflow": "scroll"
                              }}>
                             <div className={"ml-3 border border-top-0 bg-white"}>
 
@@ -673,6 +674,10 @@ export default class GraphCanvas extends DefaultRemoteComponent {
                                     }}
                                     makeQuery={this.makeQuery.bind(this)}
                                     startNewQueryInConsole={this.startNewQueryInConsole.bind(this)}
+                                    cardBodyStyle={{
+                                        "overflow": "scroll",
+                                        "maxHeight": "calc(100vh - 215px)"
+                                    }}
                                 />
                             </div>
                         </div>
diff --git a/src/web/viewlets/canvas/query-history.js b/src/web/viewlets/canvas/query-history.js
index 58a6228..4151769 100644
--- a/src/web/viewlets/canvas/query-history.js
+++ b/src/web/viewlets/canvas/query-history.js
@@ -26,7 +26,8 @@ export default class RequestHistoryView extends React.Component {
         // connector: PropTypes.func,
         startNewQueryInConsole: PropTypes.func,
         query: PropTypes.string,
-        onClose: PropTypes.func
+        onClose: PropTypes.func,
+        cardBodyStyle: PropTypes.object
     };
 
     constructor(props) {
@@ -77,7 +78,33 @@ export default class RequestHistoryView extends React.Component {
                     <FontAwesomeIcon icon={faHistory}/> Query History
                 </Card.Header>
                 <Card.Body className={"p-0 "}>
-                    <div>
+                    <div className={"pl-2 pr-2 pb-2 pt-1"}>
+                        <Button variant={"outline-secondary mt-2 mr-2"} type={"button"}
+                                className={"pt-0 pb-0 pl-2 pr-2 rounded-0"}
+                                onClick={() => this.props.onClose()}>close
+                        </Button>
+
+
+                        <Button variant={"outline-secondary mt-2"} type={"button"}
+                                className={"pt-0 pb-0 pl-2 pr-2 rounded-0"}
+                                disabled={!(this.state.showStartCount > 0)}
+                                onClick={() => this.showPrev()}>prev
+                        </Button>
+
+
+                        <Button variant={"outline-secondary mt-2"} type={"button"}
+                                className={"pt-0 pb-0 pl-2 pr-2 rounded-0"}
+                                disabled={!(existingHistory.length > this.state.showEndCount)}
+
+                                onClick={() => this.showNext()}>next </Button>
+
+                        <span className={"float-right text-muted small"}>
+                            showing {this.state.showStartCount} to {this.state.showEndCount} of {existingHistory.length}
+                        </span>
+
+
+                    </div>
+                    <div  style={this.props.cardBodyStyle}>
                         {historyToShow.length > 0
                             ?
                             <ul className={"list-group  rounded-0"}>
@@ -126,34 +153,6 @@ export default class RequestHistoryView extends React.Component {
                             : <p className={"p-3 text-muted"}>Hm! No query history found!.</p>
                         }
                     </div>
-                    <div className={"p-2"}>
-                        <Button variant={"outline-secondary mt-2 mr-2"} type={"button"}
-                                className={"pt-0 pb-0 pl-2 pr-2 rounded-0"}
-                                onClick={() => this.props.onClose()}>close
-                        </Button>
-
-
-                        <Button variant={"outline-secondary mt-2"} type={"button"}
-                                className={"pt-0 pb-0 pl-2 pr-2 rounded-0"}
-                                disabled={!(this.state.showStartCount > 0)}
-                                onClick={() => this.showPrev()}>prev
-                        </Button>
-
-
-                        <Button variant={"outline-secondary mt-2"} type={"button"}
-                                className={"pt-0 pb-0 pl-2 pr-2 rounded-0"}
-                                disabled={!(existingHistory.length > this.state.showEndCount)}
-
-                                onClick={() => this.showNext()}>next </Button>
-
-                        <span className={"float-right text-muted small"}>
-                            showing {this.state.showStartCount} to {this.state.showEndCount} of {existingHistory.length}
-                        </span>
-
-
-                    </div>
-
-
                 </Card.Body>
             </Card>
 
diff --git a/src/web/views/console.js b/src/web/views/console.js
index 8ba30c9..51d53b0 100644
--- a/src/web/views/console.js
+++ b/src/web/views/console.js
@@ -150,6 +150,10 @@ export default class ConsoleView extends DefaultRemoteRoutableComponent {
                                     <RequestHistoryView
                                         onClose={() => _this.setShowHistory(false)}
                                         makeQuery={this.makeQuery.bind(this)}
+                                        cardBodyStyle={{
+                                            "overflow": "scroll",
+                                            "maxHeight": "calc(100vh - 170px)"
+                                        }}
                                         startNewQueryInConsole={this.startNewQueryInConsole.bind(this)}
                                     />
                                 </Modal.Body>