Tutorial: Bindings/Numeric Inputs

Add style to align "numeric" and "range" inputs horizontally.
5 years ago · 81290ea617
parent a5968dd2d0
commit 81290ea617
2 changed files with 12 additions and 2 deletions
--- a/site/content/tutorial/06-bindings/02-numeric-inputs/app-a/App.svelte
+++ b/site/content/tutorial/06-bindings/02-numeric-inputs/app-a/App.svelte
@ -13,4 +13,9 @@
 	<input type=range value={b} min=0 max=10>
 </label>

-<p>{a} + {b} = {a + b}</p>
+<p>{a} + {b} = {a + b}</p>
+
+<style>
+	label { display: flex }
+	input, p { margin: 6px }
+</style>
--- a/site/content/tutorial/06-bindings/02-numeric-inputs/app-b/App.svelte
+++ b/site/content/tutorial/06-bindings/02-numeric-inputs/app-b/App.svelte
@ -13,4 +13,9 @@
 	<input type=range bind:value={b} min=0 max=10>
 </label>

-<p>{a} + {b} = {a + b}</p>
+<p>{a} + {b} = {a + b}</p>
+
+<style>
+	label { display: flex }
+	input, p { margin: 6px }
+</style>