Viewing 2 posts - 1 through 2 (of 2 total)
  • Author
    Posts
  • #315400

    Hello,

    I added search to the mobile menu as described on another page using the following css.

    Everything works great except on phones, the search box is partially cut-off. How can I fix this by either making the box smaller or centering the box?

    Thank you.

    CSS:

    /* Mobile Search */
    @media only screen and (max-width: 767px) {
    .html_mobile_menu_tablet .main_menu, .html_mobile_menu_tablet #header_main_alternate, .responsive #header .main_menu ul, #top #menu-item-search { display: block; }
    }

    @media only screen and (max-width: 767px) {
    .html_mobile_menu_phone .main_menu, .html_mobile_menu_phone #header_main_alternate, .responsive #header .main_menu ul, #top #menu-item-search { display: block; }
    .av-main-nav li { display: none; }}

    @media only screen and (max-width: 767px) {
    nav.main_menu { float: right; margin-right: 70px; }}

    @media only screen and (max-width: 767px) {
    nav.main_menu { margin-right: 70px !important; }}
    /* End Mobile Search */

    #316232

    Hey davisar!

    Try:

    
    @media only screen and (max-width: 479px) {
    .avia-search-tooltip.avia-tt {
        margin-left: -47px;
    }
    span.avia-arrow-wrap {
        display: none;
    }
    }
    

    Best regards,
    Devin

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