Use semantically more correct elements for error bubble

components/app.js

@@ -1231,11 +1231,11 @@ export default class App extends Component {
 		let error = null;
 		if (this.state.error) {
 			error = html`
-				<p id="error-msg">
+				<div id="error-msg">
 					${this.state.error}
 					${" "}
-					<a href="#" onClick=${this.dismissError}>×</a>
-				</p>
+					<button onClick=${this.dismissError}>×</button>
+				</div>
 			`;
 		}
 

style.css

@@ -460,9 +460,12 @@ details summary[role="button"] {
 	margin: 0.5rem;
 }
 
-#error-msg a {
-	color: white;
-	text-decoration: none;
+#error-msg button {
+	border: none;
+	background: transparent;
+	color: inherit;
+	font-size: inherit;
+	padding: 0;
 }
 
 .error-text {