diff --git a/src/fencer.html b/src/fencer.html
index 996c9c1..75dff20 100644
--- a/src/fencer.html
+++ b/src/fencer.html
@@ -410,8 +410,8 @@ <h2>Mappings</h2>
 						<option value="powers-of-10">powers of 10</option>
 						<option value="fill-space-40">fill space 40</option>
 						<option value="fill-space-20">fill space 20</option>
-						<option value="grid-20">grid 20</option>
 						<option value="grid-40">grid 40</option>
+						<option value="grid-20">grid 20</option>
 					</select>
 					<br>
 					<label for="integer-snapping">Snap to integers</label> <input type="checkbox" id="integer-snapping">
diff --git a/src/fencer.js b/src/fencer.js
index 8de5a7f..a162c05 100644
--- a/src/fencer.js
+++ b/src/fencer.js
@@ -1027,18 +1027,14 @@ function mappingsChanged(mode) {
 		let pathStr = "";
 
 		// vertical lines
-		for (let xn=0; xn < xGraticules.length; xn++) {
-			for (let yn=0; yn < yGraticules.length; yn++) {
+		for (let xn=0; xn < xGraticules.length; xn++)
+			for (let yn=0; yn < yGraticules.length; yn++)
 				pathStr += (yn === 0 ? "M" : "L") + svgCoordsFromAxisCoords(gridLocations[xn * yGraticules.length + yn][1]).join();
-			}
-		}
 
 		// horizontal lines
-		for (let yn=0; yn < yGraticules.length; yn++) {
-			for (let xn=0; xn < xGraticules.length; xn++) {
+		for (let yn=0; yn < yGraticules.length; yn++)
+			for (let xn=0; xn < xGraticules.length; xn++)
 				pathStr += (xn === 0 ? "M" : "L") + svgCoordsFromAxisCoords(gridLocations[xn * yGraticules.length + yn][1]).join();
-			}
-		}
 
 		// add the path to the SVG
 		const path = SVG("path", {d: pathStr, stroke: "grey", fill: "none"});