[Resolved] Slight modification header on mobile

Home Forums Support [Resolved] Slight modification header on mobile

Home Forums Support Slight modification header on mobile

Viewing 6 posts - 1 through 6 (of 6 total)
  • Author
    Posts
  • #1112351
    Chris

    Here’s how my current mobile header looks like: http://prntscr.com/qer9v8

    How can I make it look like this: http://prntscr.com/qer80v

    #1112396
    David
    Staff
    Customer Support

    Hi there,

    try adding this CSS to make the search occupy the width of the nav – with some border around it:

    @media (max-width: 768px) {
        .custom-search-form {
            width: 90%;
            margin-left: auto;
            margin-right: auto;
            margin-bottom: 10px;
        }
        .custom-search-form input[type="search"] {
            max-width: 80%;
        }
        .custom-search-form button {
            display: none;
        }
    }
    #1112404
    Chris

    Great, how do I remove the search icon: http://prntscr.com/qes9di

    #1112408
    David
    Staff
    Customer Support

    Edited the CSS above

    #1112447
    Chris

    Sanks!

    #1112495
    David
    Staff
    Customer Support

    You’re welcome

Viewing 6 posts - 1 through 6 (of 6 total)
  • You must be logged in to reply to this topic.