diff --git a/examples/constellation_clamp.html b/examples/constellation_clamp.html
index 001f29148a..c322d75496 100644
--- a/examples/constellation_clamp.html
+++ b/examples/constellation_clamp.html
@@ -49,6 +49,7 @@
 			}
 			main {
 				flex: 1;
+				min-width: 1280px;
 			}
 			pre {
 				display: none;
@@ -99,9 +100,10 @@ <h1>bevy_trackball/examples/constellation_clamp.rs</h1>
 							e.preventDefault();
 							e.stopPropagation();
 						});
-						let pre = document.body.querySelector('pre');
-						pre.prepend(canvas);
+						let main = document.body.querySelector('main');
+						main.prepend(canvas);
 						canvas.style.display = 'block';
+						let pre = document.body.querySelector('pre');
 						pre.style.display = 'block';
 					}
 				});
diff --git a/examples/egui.html b/examples/egui.html
index 6a164360d8..1976667d2c 100644
--- a/examples/egui.html
+++ b/examples/egui.html
@@ -49,6 +49,7 @@
 			}
 			main {
 				flex: 1;
+				min-width: 1280px;
 			}
 			pre {
 				display: none;
@@ -99,9 +100,10 @@ <h1>bevy_trackball/examples/egui.rs</h1>
 							e.preventDefault();
 							e.stopPropagation();
 						});
-						let pre = document.body.querySelector('pre');
-						pre.prepend(canvas);
+						let main = document.body.querySelector('main');
+						main.prepend(canvas);
 						canvas.style.display = 'block';
+						let pre = document.body.querySelector('pre');
 						pre.style.display = 'block';
 					}
 				});
diff --git a/examples/exponential_map.html b/examples/exponential_map.html
index 4ec6f16f89..b172f08244 100644
--- a/examples/exponential_map.html
+++ b/examples/exponential_map.html
@@ -49,6 +49,7 @@
 			}
 			main {
 				flex: 1;
+				min-width: 1280px;
 			}
 			pre {
 				display: none;
@@ -99,9 +100,10 @@ <h1>bevy_trackball/examples/exponential_map.rs</h1>
 							e.preventDefault();
 							e.stopPropagation();
 						});
-						let pre = document.body.querySelector('pre');
-						pre.prepend(canvas);
+						let main = document.body.querySelector('main');
+						main.prepend(canvas);
 						canvas.style.display = 'block';
+						let pre = document.body.querySelector('pre');
 						pre.style.display = 'block';
 					}
 				});
diff --git a/examples/gliding_clamp.html b/examples/gliding_clamp.html
index 23160ca0d7..f7dd5bfbd1 100644
--- a/examples/gliding_clamp.html
+++ b/examples/gliding_clamp.html
@@ -49,6 +49,7 @@
 			}
 			main {
 				flex: 1;
+				min-width: 1280px;
 			}
 			pre {
 				display: none;
@@ -99,9 +100,10 @@ <h1>bevy_trackball/examples/gliding_clamp.rs</h1>
 							e.preventDefault();
 							e.stopPropagation();
 						});
-						let pre = document.body.querySelector('pre');
-						pre.prepend(canvas);
+						let main = document.body.querySelector('main');
+						main.prepend(canvas);
 						canvas.style.display = 'block';
+						let pre = document.body.querySelector('pre');
 						pre.style.display = 'block';
 					}
 				});