diff --git a/lms/templates/discussion/_filter_dropdown.html b/lms/templates/discussion/_filter_dropdown.html
index db31d2b809..45c119991f 100644
--- a/lms/templates/discussion/_filter_dropdown.html
+++ b/lms/templates/discussion/_filter_dropdown.html
@@ -38,7 +38,7 @@ from openedx.core.djangolib.markup import HTML
 
 <%def name="render_category(categories, category, topic_list)">
     <li class="forum-nav-browse-menu-item"
-        id='${category | u}'
+        id='${category | n, decode.utf8}'
         role="option"
     >
         <span class="forum-nav-browse-title">${category}</span>
@@ -51,12 +51,11 @@ from openedx.core.djangolib.markup import HTML
 </%def>
 
 <div class="forum-nav-browse-menu-wrapper" style="display: none" aria-label="${_("Discussion topics list")}">
-    <form class="forum-nav-browse-filter" autocomplete="off">
-        <label>
-            <span class="sr">${_("Filter Topics")}</span>
-            <input type="text" id="forum-nav-browse-filter-input" role="combobox" aria-expanded="true" aria-owns="discussion_topics_listbox" aria-autocomplete="list" class="forum-nav-browse-filter-input" placeholder="${_("filter topics")}">
-            <span class="icon fa fa-filter" aria-hidden="true"></span>
-        </label>
+    <form class="forum-nav-browse-filter" autocomplete="off" style="display: grid">
+        <label for="forum-nav-browse-filter-input" aria-label='${_("Filter Topics")}'></label>
+        <span class="sr">${_("Filter Topics")}</span>
+        <input type="text" id="forum-nav-browse-filter-input" role="combobox" aria-expanded="true" aria-owns="discussion_topics_listbox" aria-autocomplete="list" class="forum-nav-browse-filter-input" placeholder="${_("filter topics")}">
+        <span class="icon fa fa-filter" aria-hidden="true"></span>
     </form>
     <ul class="forum-nav-browse-menu" role="listbox" id="discussion_topics_listbox">
         <li class="forum-nav-browse-menu-item forum-nav-browse-menu-all" role="option" id="all_discussions">