html - bootstrap: Image in tab messed up with other tab displays -


well trying put image left of nav tabs, seems isnt right. tabs align top of image, while want opposite, tabs should align bottom of image. can see screenshot more details of how messed up: enter image description here

below html code use bootstrap, know how solve display issue?

    <ul class="nav nav-tabs nav-justified">         <li class="nav nav-item"><img src="{$image}" class="img-responsive"></li>         <li id="atab1" class="nav-item"><a href="#tab1" data-toggle="tab" class="nav-link active">about</a></li>         <li id="atab2" class="nav-item"><a href="#tab2" data-toggle="tab" class="nav-link">posts</a></li>         <li id="atab3" class="nav-item"><a href="#tab3" data-toggle="tab" class="nav-link">goods</a></li>         <li id="atab4" class="nav-item"><a href="#tab4" data-toggle="tab" class="nav-link">services</a></li>         <li id="atab5" class="nav-item"><a href="#tab5" data-toggle="tab" class="nav-link">jobs</a></li>     </ul> 

.nav-item {    vertical-align: bottom;  }


Comments

Popular posts from this blog

java - Checkbox item adds to spinner -

C# MVC AngularJS -

php - mySQL problems with this code? -