我的博客主题中没有显示菜单栏？

Question

The menu bar is not able to show up on my blogger site on any device idk why. My blog link is https://edifiess.blogspot.com/ I don't have much experience in web programming I had already read some of the answers but could not find the exact solution.

The code that is creating the error is attached here.

<div class='container menu-wrap'>
        <b:section class='menu' id='menu' maxwidgets='1' name='Main Menu' showaddelement='yes'>
          <b:widget id='LinkList210' locked='true' title='Menu' type='LinkList' version='1'>
            <b:widget-settings>
              <b:widget-setting name='sorting'>NONE</b:widget-setting>
              <b:widget-setting name='text-1'>Flutter</b:widget-setting>
              <b:widget-setting name='link-1'>https://edifiess.blogspot.com/search/label/Flutter</b:widget-setting>
              <b:widget-setting name='text-0'>Home</b:widget-setting>
              <b:widget-setting name='link-0'>#</b:widget-setting>
            </b:widget-settings>
            <b:includable id='main'>
            <div class='widget-content'>
              <ul itemscope='' itemtype='http://schema.org/SiteNavigationElement'> 
                <li><a expr:href='data:blog.homepageUrl'>Home</a></li>
                <b:loop values='data:links' var='link'>
                  <li itemprop='name'><a expr:href='data:link.target' itemprop='url'><data:link.name/></a></li>
                </b:loop>
              </ul>
            </div>
          </b:includable>
          </b:widget>
          <b:widget id='LinkList110' locked='false' title='Menu' type='LinkList' version='1'>
            <b:widget-settings>
              <b:widget-setting name='link-7'>#</b:widget-setting>
              <b:widget-setting name='link-5'>#</b:widget-setting>
              <b:widget-setting name='link-6'>#</b:widget-setting>
              <b:widget-setting name='link-3'>#</b:widget-setting>
              <b:widget-setting name='link-4'>#</b:widget-setting>
              <b:widget-setting name='text-1'>Feature</b:widget-setting>
              <b:widget-setting name='text-0'>Post Style</b:widget-setting>
              <b:widget-setting name='text-3'>_Mobile</b:widget-setting>
              <b:widget-setting name='text-2'>_Gadget</b:widget-setting>
              <b:widget-setting name='text-5'>Categories</b:widget-setting>
              <b:widget-setting name='text-4'>Pages</b:widget-setting>
              <b:widget-setting name='text-7'>Forum</b:widget-setting>
              <b:widget-setting name='text-6'>Buddypress</b:widget-setting>
              <b:widget-setting name='sorting'>NONE</b:widget-setting>
              <b:widget-setting name='link-1'>#</b:widget-setting>
              <b:widget-setting name='link-2'>#</b:widget-setting>
              <b:widget-setting name='link-0'>#</b:widget-setting>
            </b:widget-settings>
            <b:includable id='main'>
          <div class='widget-content'>
            <ul id='nav' itemscope='' itemtype='http://schema.org/SiteNavigationElement'>
              <b:loop values='data:links' var='link'>
                <li itemprop='name'><a expr:href='data:link.target' itemprop='url'><data:link.name/></a></li>
              </b:loop>
           </ul> 
           <script type='text/javascript'> 
            //<![CDATA[
            $("#LinkList110").each(function(){var e="<ul id='nav'><li><ul id='sub-menu'>";$("#LinkList110 li").each(function(){var t=$(this).text(),n=t.substr(0,1),r=t.substr(1);"_"==n?(n=$(this).find("a").attr("href"),e+='<li><a href="'+n+'">'+r+"</a></li>"):(n=$(this).find("a").attr("href"),e+='</ul></li><li><a href="'+n+'">'+t+"</a><ul id='sub-menu'>")});e+="</ul></li></ul>";$(this).html(e);$("#LinkList110 ul").each(function(){var e=$(this);if(e.html().replace(/\s|&nbsp;/g,"").length==0)e.remove()});$("#LinkList110 li").each(function(){var e=$(this);if(e.html().replace(/\s|&nbsp;/g,"").length==0)e.remove()})});
            //]]>
            </script>
          </div>
        </b:includable>
          </b:widget>
        </b:section>

  </div>
      </div>

  </div>
  <div class='clear'/>

@media only screen and (max-width: 768px) {
.tm-menu {
text-align:center;
height:auto;
    }
#menu {
    display: block;
    float: none;
    height: auto;
}
.menu-wrap {
    margin: 0 auto;
    height: auto;
}
.top-bar-social {
    float: none;
    margin: 0 auto;
    }
.top-bar-social li {
    display: inline-block;
    float: none;
}
ul#nav {
    display: none;
}
.selectnav {
width: auto;
color: #222;
background: #f4f4f4;
border: 1px solid rgba(255,255,255,0.1);
position: relative;
border: 0;
padding: 6px 10px!important;
margin: 5px 0;
}
.selectnav {
display: block;
width: 100%;
max-width:200px;
}
.tm-menu .selectnav {
display:inline-block;
    margin: 10px 0;
}
.showpageArea {
    padding-top: 20px;
}
.post_item {
    margin-left: 0;
}
.search-bar {display: none;
}
.header_right {
height: 66px;    
overflow: hidden;
}

#top_menu span.nav_select {
top: 15px;    
}
div#topimg{width:460px ; height:auto}
.row .row{width:auto;max-width:none;min-width:0;margin:0 -10px}
.container{width:auto;max-width:500px;margin:0 auto;min-width:0}
#post_grids .column,#post_grids .columns{width:100%;float:none;padding:0 14px;margin-bottom:14px}
.column:last-child,.columns:last-child{float:none}
[class*="column"] + [class*="column"]:last-child{float:none}
.column:before,.columns:before,.column:after,.columns:after{content:"";display:table}
.column:after,.columns:after{clear:both}
.top_wrapper{margin-bottom:14px}

#header-wrapper .header_left,#header-wrapper .header_right{float:none;width:auto}
#header-wrapper .header_left{margin-bottom:30px}
#top_menu{position:relative;right:0}
#header{float:none;text-align:center;margin:0;margin-bottom:10px}
#header img{display:inline;margin:0 auto}
#top_menu{float:none;width:450px}
#top_menu .sf-menu,.header_search{display:none}
#top_menu span.nav_select,.select_menu{display:block}
#leftContent{width:auto;float:none;margin:0}
#leftContent .inner{margin:0}
.white_box .white_box_inner{padding:10px}
.post_item_inner,.post_single_inner{padding:14px}
.post_single{margin-bottom:14px}
.social_share,.post_author{display:none}
#related-posts ul li {
    width: 32.7%;
    height: 165px;
}
#footer{padding-top:14px}
#top_menu {
width: 94%;
}
.ops-404 {
    width: 70%;
}
#header img {
    padding: 35px 0px 0px 5px;
}
<b:if cond='data:blog.pageType != &quot;index&quot;'>
.post_item h1 {
       font-size: 32px;
    margin-bottom: 18px;

}
.post-share-buttons {
    margin-left: 0;  
}
.dummy-container, .google-plus-share-container {
    vertical-align: top;
    padding-left: 0;
}

If any further data is required let me know

Answer 1

Add this to your CSS

#menu .widget {
    display: inline-flex !important;
}