diff --git a/src/main/java/stirling/software/SPDF/controller/api/SplitPdfBySectionsController.java b/src/main/java/stirling/software/SPDF/controller/api/SplitPdfBySectionsController.java
index 4fcba55c..29a2f426 100644
--- a/src/main/java/stirling/software/SPDF/controller/api/SplitPdfBySectionsController.java
+++ b/src/main/java/stirling/software/SPDF/controller/api/SplitPdfBySectionsController.java
@@ -42,10 +42,10 @@ public class SplitPdfBySectionsController {
         PDDocument sourceDocument = PDDocument.load(file.getInputStream());
 
         // Process the PDF based on split parameters
-        int horiz = request.getHorizontalDivisions();
-        int verti = request.getVerticalDivisions();
+        int horiz = request.getHorizontalDivisions() + 1;
+        int verti = request.getVerticalDivisions() + 1;
 
-        List<PDDocument> splitDocuments = splitPdfPages(sourceDocument, horiz, verti);
+        List<PDDocument> splitDocuments = splitPdfPages(sourceDocument, verti, horiz);
         for (PDDocument doc : splitDocuments) {
             ByteArrayOutputStream baos = new ByteArrayOutputStream();
             doc.save(baos);
@@ -108,7 +108,7 @@ public class SplitPdfBySectionsController {
                     try (PDPageContentStream contentStream = new PDPageContentStream(subDoc, subPage)) {
                         // Set clipping area and position
                         float translateX = -subPageWidth * i;
-                        float translateY = height - subPageHeight * (j + 1) - subPageHeight;
+                        float translateY = height - subPageHeight * (verticalDivisions - j);
 
                         contentStream.saveGraphicsState();
                         contentStream.addRect(0, 0, subPageWidth, subPageHeight);
@@ -129,6 +129,7 @@ public class SplitPdfBySectionsController {
     }
 
 
+
     
 
 }
diff --git a/src/main/resources/templates/split-pdf-by-sections.html b/src/main/resources/templates/split-pdf-by-sections.html
index 9978ca50..5fdc1e48 100644
--- a/src/main/resources/templates/split-pdf-by-sections.html
+++ b/src/main/resources/templates/split-pdf-by-sections.html
@@ -17,13 +17,70 @@
                             <div th:replace="~{fragments/common :: fileSelector(name='fileInput', multiple=false, accept='application/pdf')}"></div>
                             
                             <label for="horizontalDivisions" th:text="#{split-by-sections.horizontal.label}">Horizontal Divisions</label>
-                            <input type="number" id="horizontalDivisions" name="horizontalDivisions" class="form-control" min="1" required th:placeholder="#{split-by-sections.horizontal.placeholder}">
+                            <input type="number" id="horizontalDivisions" name="horizontalDivisions" class="form-control" min="0" max="300" value="0" required th:placeholder="#{split-by-sections.horizontal.placeholder}">
                             <br>
 
                             <label for="verticalDivisions" th:text="#{split-by-sections.vertical.label}">Vertical Divisions</label>
-                            <input type="number" id="verticalDivisions" name="verticalDivisions" class="form-control" min="1" required th:placeholder="#{split-by-sections.vertical.placeholder}">
+                            <input type="number" id="verticalDivisions" name="verticalDivisions" class="form-control" min="0" max="300" required value="1" th:placeholder="#{split-by-sections.vertical.placeholder}">
                             <br>
-                        
+                        	<style>
+                        	.pdf-visual-aid {
+							    width: 150px; /* Adjust as needed */
+							    height: 200px; /* Adjust as needed */
+							    border: 1px solid black; /* Represents the PDF page */
+							    position: relative;
+							}
+							.line {
+							    position: absolute;
+							    background-color: red; /* Line color */
+							}
+                        	
+                        	</style>
+                        	
+                        	<div id="pdfVisualAid" class="pdf-visual-aid"></div>
+                        	<Script>
+                        	function updateVisualAid() {
+                        	    const horizontalDivisions = document.getElementById('horizontalDivisions').value;
+                        	    const verticalDivisions = document.getElementById('verticalDivisions').value;
+                        	    const aid = document.getElementById('pdfVisualAid');
+								
+                        	    if(horizontalDivisions > 300)
+                        	    	horizontalDivisions = 300
+                       	    	if(verticalDivisions > 300)
+                       	    		verticalDivisions = 300
+                        	    // Clear existing lines
+                        	    aid.innerHTML = '';
+
+                        	 // Add horizontal lines
+                        	    for (let i = 0; i < horizontalDivisions; i++) {
+                        	        const line = document.createElement('div');
+                        	        line.classList.add('line');
+                        	        line.style.width = '100%';
+                        	        line.style.height = '1px';
+                        	        line.style.top = `${((i + 1) / (parseInt(horizontalDivisions) + 1)) * 100}%`;
+                        	        aid.appendChild(line);
+                        	    }
+
+                        	    // Add vertical lines
+                        	    for (let i = 0; i < verticalDivisions; i++) {
+                        	        const line = document.createElement('div');
+                        	        line.classList.add('line');
+                        	        line.style.height = '100%';
+                        	        line.style.width = '1px';
+                        	        line.style.left = `${((i + 1) / (parseInt(verticalDivisions) + 1)) * 100}%`;
+                        	        aid.appendChild(line);
+                        	    }
+                        	}
+
+                        	// Event listeners
+                        	document.getElementById('horizontalDivisions').addEventListener('input', updateVisualAid);
+                        	document.getElementById('verticalDivisions').addEventListener('input', updateVisualAid);
+
+                        	// Initial draw
+                        	updateVisualAid();
+
+                        	</Script>
+                        	</br>
                             <button type="submit" id="submitBtn" class="btn btn-primary" th:text="#{split-by-sections.submit}">Submit</button>
                         </form>