Я установил ширину поля поиска pf в 0. Но это все еще показывает это. Вероятно, потому что я использую flex. Но почему?

Я нашел возможное решение этой проблемы здесь .

В соответствии с этой страницей ваш запрос должен выглядеть примерно так:

SELECT p FROM SiteVersion v, Page p WHERE v.id = 5 AND p.slug='index' AND v.page = p;

Решает ли ваша проблема?

1
задан kukkuz 1 March 2019 в 03:00
поделиться

1 ответ

Вместо того, чтобы поставить width to 0, измените на display:none;, как показано ниже. Это делает трюк!

    #search-box{
    flex-grow:0.7;
    border-radius:50px;
    height:50px;
    margin:25px 60px 0px 50px;
    box-sizing: border-box;
    width:0px;
    transition:all 0.8s ease;
    background-color:black;
    }
    #search-txt{
        position:relative;
        top:13px;
        left:15px;
        display:none;
        outline:none;
        background:white;
        border:none;
        }
    #search-btn{
        float:right;
        position:relative;
        bottom:8px;
        left:5px;
        height:60px;
        width:65px;
        background: green;
        border-radius: 50%;
        outline:none;
        cursor:pointer;

    }
    #search-box.active{
        width:200px;
        border:1px solid black;
    }
<section>
    <h1> <span> @ </span>USMAN'S WEBSITE </h1>
    <ul>
    <a href="#"> <li> <i class="fas fa-home"></i><br>HOME </li> </a>
    <a href="#"> <li> <i class="far fa-newspaper"></i><br> ABOUT  </li> </a>
    <a href="#"> <li> <i class="fas fa-briefcase"></i> <br>  WORK </li></a>
    <a href="#"> <li> <i class="fas fa-user-alt"></i> <br>  TEAM </li></a>
    <a href="#"> <li> <i class="fas fa-phone"></i><br>CONTACT  </li></a>
    </ul>
    <div id="search-box">
    <input id="search-txt" type="text" placeholder="Search.."  >
    <button id="search-btn" type="submit"><i class="fas fa-search"></i></button>
    </div>

    </section>

0
ответ дан mindmaster 1 March 2019 в 03:00
поделиться