diff --git a/source/developing.html.erb.md b/source/developing.html.erb.md
index 4ea38e05..9e88a552 100644
--- a/source/developing.html.erb.md
+++ b/source/developing.html.erb.md
@@ -135,11 +135,13 @@ Use appropriate mark-up for headings, lists, tables, etc. HTML5 provides additio
 <div class="mark-up">
   <figure>
     <% html_example do %>
-    <form action="" role="search">
-      <label for="search">Search</label>
-      <input type="search" aria-describedby="search-help">
-      <div id="search-help">Search records by customer id or name</div>
-      <button type="submit">Go</button>
+    <form action="">
+      <div role="search">
+        <label for="search">Search</label>
+        <input type="search" id="search" aria-describedby="search-help">
+        <div id="search-help">Search records by customer id or name</div>
+        <button type="submit">Go</button>
+      </div>
     </form>
     <% end %>
   </figure>
@@ -493,4 +495,4 @@ These tips are only a part of web accessibility. The following resources will he
 
 {::nomarkdown}
 <%= tip :end %>
-{:/}
\ No newline at end of file
+{:/}