Mam szereg przycisków, które chciałbym równomiernie przestrzegać miejsca na moim barze NAV. Mógłbym uzyskać rozmiar każdego przycisku i opracowałem go, ale zastanawiam się, czy istnieje sposób na automatyczne działanie i ustawienie tych szerokości za obciążenia stron. W chwili minutę mam 5 przycisków i pole wejściowe i chciałbym sprawić, że te spot a 800px div.

HTML:

<div class="nav">
                <div class="nav_btn">HOME</div>
                <div class="nav_btn">NEW IN</div>
                <div class="nav_btn_drop_down">CLOTHING</div>
                <div class="nav_btn_drop_down">ACCESSORIES</div>
                <div class="nav_btn_drop_down">SHOP BY BRAND</div>
                <div class="nav_btn"><form action="" method="POST"><input type="text" placeholder="Search..." /></form></div>
            </div>

CSS:

.nav{
    height:50px;
    color:blue;
}
.nav_btn,.nav_btn_drop_down{
    float:left;
    color:#78f7fa;
}
0
Paul Ledger 6 grudzień 2013, 00:14

2 odpowiedzi

Najlepsza odpowiedź

Możesz użyć tej sztuczki za pomocą display:table-cell zamiast float:

.nav_btn, .nav_btn_drop_down{
    display:table-cell;
    width:1%;
    white-space:nowrap;
    text-align:center;
}

Sprawdź ten demo http://jsfiddle.net/xvev4/10/

2
DaniP 5 grudzień 2013, 20:23

Myślę, że padding rozwiązała twój problem:

.nav_btn,.nav_btn_drop_down{
    float:left;
    color:#78f7fa;
    padding: 10px;
}

Skrzypce

1
mamdouh alramadan 5 grudzień 2013, 20:20