Make Search Bar Full-Width

  • Resolved epicjono

    (@epicjono)


    3 years, 6 months ago

    Hello! I recently asked how to move the sidebar to the bottom of the page for single posts, and I received an answer. Now the issue is that the search bar doesn’t extend through the entire page, since it seems to have been made to fit in the sidebar specifically. I tried .search-field{} or .search-form or .search-form-container and played around with things like max-width and width, but with no success.

    To see what I mean, view the page I need help with on a device larger than a phone, and you’ll see how the search bar doesn’t fill up the space.

    The goal is to have the search bar expand horizontally to fill whatever space it is in, while still keeping the same padding. What code could I use to do this? Thanks!

    The page I need help with: [log in to see the link]

Viewing 2 replies - 1 through 2 (of 2 total)
  • Theme Author Ben Sibley

    (@bensibley)

    Hi there,

    I see what you mean. Please try adding this CSS to the site and it should allow the search bar to expand to the full width:

    .widget_search .search-field {
  max-width: none;
}
    Thread Starter epicjono

    (@epicjono)

    Thanks, works perfectly.

Viewing 2 replies - 1 through 2 (of 2 total)
  • The topic ‘Make Search Bar Full-Width’ is closed to new replies.