diff --git a/docs/components/example.html.js b/docs/components/example.html.js
index 53948f3..64d1f72 100644
--- a/docs/components/example.html.js
+++ b/docs/components/example.html.js
@@ -3,7 +3,6 @@ const host= "."+example.name;
 styles.css`
 ${host} {
 	grid-column: full-main;
-	width: calc(100% - .75em);
 	height: calc(4/6 * var(--body-max-width));
 	border-radius: var(--border-radius);
 	box-shadow: var(--shadow);
@@ -84,7 +83,6 @@ html[data-theme="light"] .cm-s-material .cm-error { color: #f44336 !important; }
 @media (max-width: 767px) {
 	${host} {
 		height: 50vh;
-		max-width: 100%;
 	}
 	${host} main {
 		flex-grow: 1;
@@ -97,7 +95,7 @@ html[data-theme="light"] .cm-s-material .cm-error { color: #f44336 !important; }
 	}
 }
 ${host}[data-variant=big]{
-	height: 100vh;
+	height: 150vh;
 
 	main {
 		flex-flow: column nowrap;
diff --git a/docs/global.css.js b/docs/global.css.js
index eb81fcc..fc8a912 100644
--- a/docs/global.css.js
+++ b/docs/global.css.js
@@ -248,7 +248,7 @@ body > main {
 }
 body > main > *, body > main slot > * {
 	width: 100%;
-	max-width: 100%;
+	max-width: calc(var(--body-max-width) * 5/3);
 	margin-inline: auto;
 	grid-column: main;
 }
@@ -281,9 +281,8 @@ body > main h3, body > main h4 {
 /* Boxes */
 .illustration{
 	grid-column: full-main;
-	width: calc(100% - .75em);
 }
-.illustration:not(:has( .comparison)){
+.illustration:not(:has( .comparison)):not(:has( .tabs)) {
 	grid-column: main;
 
 	pre {