Search box on Navigation Menu
How to float right (9 posts)

  1. Tamaralas
    Posted 1 year ago #


    Does anyone know how to make the search box float to the right side of the menu bar?

    Thanks in advance.



  2. ilanaguttman
    Posted 1 year ago #

    You can do this by editing searchform.php in the theme folder and adding some CSS. I found that each of the items in the menu had a
    <li> class, so I added <li class="menuSearch"></li> around the code.

    Then in style.css I added

        display: inline;
        float: right;
        margin-right: 7px;
        position: relative;
        list-style-type: none;

    I hope this helps!

  3. Rdesigner
    Posted 1 year ago #


    Can you please explain better what to do to get the search box float on the right? I tried to do what you said, but nothing changes.

    I added via FTP <li class="menuSearch"> to searchform.php in the theme folder. Then I added above code to custom CSS.

    What did I do wrong?

    Thanks for your answer

  4. ilanaguttman
    Posted 1 year ago #

    Hi Rianne,

    Maybe you have a conflicting style somewhere else? Please send me the link to the site and maybe I can help further.


  5. Rdesigner
    Posted 1 year ago #

    Hi llana,
    Sorry I was away for a few days. This is the link to my site.
    I put in the code as you said, but the search box doesn't move to the right.

  6. ilanaguttman
    Posted 1 year ago #

    I'm celebrating a holiday this week. Will do my best to take a look early next week.

  7. Jagdeep Bhuyan
    Posted 1 year ago #

    Sorry to answer latly...
    just open SearchBox-On-Nav_Menu.php file in the plugin folder.
    then find the line
    $items .= '<li>' . $searchform . '</li>';
    and replace the line with this --
    $items .= '<li style="float: right;">' . $searchform . '</li>';

    This will work

  8. Justin Boston
    Posted 11 months ago #

    Unfortunately, it doesn't. I've tried every trick in the CSS book and this search box won't budge.

  9. nastazia1
    Posted 10 months ago #

    $items .= '<li style="float: right; margin-right: -200px;">' . $searchform . '';

    try this it works

Topic Closed

This topic has been closed to new replies.

About this Plugin

  • Search box on Navigation Menu
  • Frequently Asked Questions
  • Support Threads
  • Reviews

About this Topic