[Vaster2] ヘッダーナビゲーションをHTML/JavaScriptガジェットに変更しました-すたすた式

スマホのときのメニューバーは別のものを設置済みなので、ヘッダーナビゲーション（グローバルナビゲーション）に関しては簡単なリンクでいいかなと思っていました。なのでこれをページガジェットから HTML/JavaScriptガジェットに変更しました。

コード

<div class="header-navi">
 <ul> 
  <li><a href="https://sutasutashiki.blogspot.com/?max-results=10">ホーム</a></li>
  <li><a href="https://sutasutashiki.blogspot.jp/search/label/%E6%9A%AE%E3%82%89%E3%81%97?max-results=10">暮らし</a></li>
  <li><a href="https://sutasutashiki.blogspot.jp/search/label/DIY?max-results=10">DIY</a></li>
  <li><a href="https://sutasutashiki.blogspot.jp/search/label/Blogger%E3%82%AB%E3%82%B9%E3%82%BF%E3%83%A0?max-results=10">Bloggerカスタム</a></li>
  <li><a href="https://sutasutashiki.blogspot.jp/search/label/Vaster1.9?max-results=10">Vaster1.9</a></li>
  <li><a href="https://sutasutashiki.blogspot.jp/search/label/Vaster2?max-results=10">Vaster2</a></li>
 </ul>
</div>
<style>
@media (max-width: 768px) { #HTML8{ display: none; } }
.header-navi {
 width: auto;
 background-color: #2f4779;
 margin: 0 auto;
 padding: 10px 10%;
}
.header-navi  ul {
 display:table;
 table-layout: fixed;
 text-align: center;
 width: 100%;
 padding: 0;
}
.header-navi li {
 display:table-cell;
 vertical-align: middle;
}
.header-navi li a{
 color: #fff;
}
/* for IE11 ページナビ調整 */
_:lang(x)::-ms-backdrop, #HTML8 {
 margin: 0;
}
</style>