title: How do I remove the search icon from wordpress menu and replace with "Search"
body: <p>The title says it all, I want to remove the search icon from the menu bar and replace it simple with the word "Search"</p>
  
  <p>My <code>style.css</code> looks like this:</p>
  
  <pre><code>.site-header .search-field {
      background-color: transparent;
      /*background-image: url(images/search-icon.png);*/
      background-position: 5px center;
      background-repeat: no-repeat;
      background-size: 24px 24px;
      border: none;
      cursor: pointer;
      height: 37px;
      margin: 3px 0;
      padding: 0 0 0 34px;
      position: relative;
      -webkit-transition: width 400ms ease, background 400ms ease;
      transition:         width 400ms ease, background 400ms ease;
      width: 0;
      z-index: 1000;
  }
  </code></pre>
  
  <p>And nowhere else in any file can I find a link to the <code>search-icon.png</code> image.</p>
  
  <p><img src="https://i.stack.imgur.com/IgyR4.png" alt="Search icon"></p>
  
  <p><img src="https://i.stack.imgur.com/gWCBA.png" alt="Search icon with textbox"></p>
  
  <p><img src="https://i.stack.imgur.com/GwByo.png" alt="Bad position"></p>
  
  <p>The last screenshot shows that the search box has dropped down. How can I position it in line horizontally with the other menu items, as far off to the right as the menu will allow?</p>
  
  <p>The CSS used to produce the nag-menu is:</p>
  
  <pre><code>/**
   * 4.2 Navigation
   * ----------------------------------------------------------------------------
   */
  
  .main-navigation {
      z-index: 1000;
      clear: both;
      margin: 0 auto;
      /*max-width: 1920px;*/
      max-width: 1080px;
      min-height: 45px;
      position: relative;
  }
  
  ul.nav-menu,
  div.nav-menu &gt; ul {
      margin: 0;
      padding: 0 40px 0 0;
  }
  
  .nav-menu li {
      display: inline-block;
      position: relative;
  }
  
  .nav-menu li a {
      color: #3c3c3c;
      display: block;
      font-size: 15px;
      /*line-height: 1;*/
      /*padding: 15px 20px;*/
      text-decoration: none;
  }
  
  .nav-menu li:hover &gt; a,
  .nav-menu li a:hover {
      /*background-color: #220e10;*/
      /*background-color: #333333;*/
      color: #666;
  }
  
  .nav-menu .sub-menu,
  .nav-menu .children {
      /*background-color: #220e10;*/
      background-color: #ffffff;
      /*border: 2px solid #f7f5e7;*/
      border: 2px solid #ffffff;
      border-top: 0;
      display: none;
      padding: 0;
      position: absolute;
      left: -2px;
      z-index: 1000;
      box-shadow: 0 0 8px rgba(0,0,0,.3);
      top: 100%;
  }
  
  .nav-menu .sub-menu ul,
  .nav-menu .children ul {
      border-left: 0;
      left: 100%;
      top: 0;
  }
  
  ul.nav-menu ul a,
  .nav-menu ul ul a {
      color: #3c3c3c;
      margin: 0;
      width: 200px;
  }
  
  ul.nav-menu ul a:hover,
  .nav-menu ul ul a:hover {
      /*background-color: #db572f;*/
  }
  
  ul.nav-menu li:hover &gt; ul,
  .nav-menu ul li:hover &gt; ul {
      display: block;
  }
  
  .nav-menu .current_page_item &gt; a,
  .nav-menu .current_page_ancestor &gt; a,
  .nav-menu .current-menu-item &gt; a,
  .nav-menu .current-menu-ancestor &gt; a {
      /*background-color: #666;*/
  
      color: #666;
      /*font-style: italic;*/
  }
  
  /* Arrow underneath */
  
  /*
  .nav-menu .current_page_item &gt; a:after,
  .nav-menu .current_page_ancestor &gt; a:after,
  .nav-menu .current-menu-item &gt; a:after,
  .nav-menu .current-menu-ancestor &gt; a:after {
      width: 0;
      height: 0;
      position: absolute;
      content:"";
      display:block;
  
      border-left: 6px solid transparent;
      border-right: 6px solid transparent;
      border-bottom: 6px solid #666;
  
      left: 50%;
  
      margin-left: -6px;
  }
  */
  
  .menu-toggle {
      display: none;
  }
  
  /* Navbar */
  .navbar {
      /*background-color: #f7f5e7;*/
      /*background-color: #fff;*/
      margin: 0 auto;
      max-width: 1600px;
      width: 100%;
  }
  
  .site-header .search-form {
      position: absolute;
      right: 20px;
  }
  
  .site-header .search-field {
      background-color: transparent;
      /*background-image: url(images/search-icon.png);*/
      /*background-position: 5px center;
      background-repeat: no-repeat;
      background-size: 24px 24px;*/
      border: none;
      cursor: pointer;
      /*height: 37px;*/
      margin: 0 auto;
      /*padding: 0 0 0 34px;*/
      position: relative;
      /*-webkit-transition: width 400ms ease, background 400ms ease;
      transition:         width 400ms ease, background 400ms ease;*/
      /*width: 0;*/
      width: 120px;
      min-height: 45px;
      z-index: 1000;
  }
  
  .site-header .search-field:focus {
      /*background-color: #fff;*/
      /*border: 2px solid #c3c0ab;*/
      /*border: 1px solid #666666;*/
      cursor: text;
      outline: 0;
      color: #666666;
      /*width: 230px;*/
  }
  </code></pre>