diff --git a/src/components/ConfigCover.js b/src/components/ConfigCover.js
index abaea2b..2645b42 100644
--- a/src/components/ConfigCover.js
+++ b/src/components/ConfigCover.js
@@ -41,7 +41,12 @@ class ConfigCover extends React.Component {
 	getRandomTheme = (theme, Pattern) => {
 		this.setState({ bgColor: theme.bgColor, borderColor: theme.bdColor, pattern: Pattern });
 	}
-
+	//this function will set the max border value to 50 if user types a value greater than 50
+	maxBorderValidationCheck = (e) => {
+		if(e.target.value > 50) {
+			e.target.value = 50;
+		}
+	}
 	render() {
 		return (
 			<div className="main-container">
@@ -118,7 +123,7 @@ class ConfigCover extends React.Component {
 						<div className="d-flex flex-row">
 							<div className="input-sm">
 								<label>Size</label>
-								<input type="number" className="form-control " value={this.state.borderSize} onChange={(e) => this.setState({ borderSize: e.target.value })} />
+								<input type="number" max="50" onInput = {this.maxBorderValidationCheck} className="form-control " value={this.state.borderSize} onChange={(e) => this.setState({ borderSize: e.target.value })} />
 							</div>
 
 							<div className="input-sm">
diff --git a/src/components/CoverImage.css b/src/components/CoverImage.css
index ad33a45..7ea6cf8 100644
--- a/src/components/CoverImage.css
+++ b/src/components/CoverImage.css
@@ -8,7 +8,7 @@
     width:800px;
     padding:90px;
     border-radius:2px;
-    
+    overflow-y: hidden;
 
 }