Center image in nav menu bar

5

How do I center an image in the Menu bar? When I say centralize, I mean not the image in the middle of the bar, but in whatever position it is, it has the same "measures" for the top and bottom. How do I define this in my css ? Below the code of my menu. I would like the image to be before "My Company Name" and not later, as it is.

<div class="navbar navbar-inverse navbar-fixed-top">
    <div class="container">
        <div class="navbar-header">
            <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
                <span class="icon-bar"></span>
            </button>
            <img src="~/Images/Logomarca_mini.jpg" />
            @Html.ActionLink("Nome da Minha Empresa", "Index", "Home", new { area = "" }, new { @class = "navbar-brand" })
        </div>
        <div class="navbar-collapse collapse">
            <ul class="nav navbar-nav">
                <li>@Html.ActionLink("Home", "Index", "Home")</li>
                <li>@Html.ActionLink("About", "About", "Home")</li>
                <li>@Html.ActionLink("Contact", "Contact", "Home")</li>
            </ul>
            @Html.Partial("_LoginPartial")
        </div>
    </div>
</div>
    
asked by anonymous 22.05.2015 / 21:13

2 answers

1

Set the elements at the same level as the image with display: inline-block and line-height with the same size as the container

link

For the button to be right, in the example set a height and margins according to the size of the container

    
22.05.2015 / 21:41
1

Here he resolved:

.....
</button>

  <div class="navbar-header">
     <a class="navbar-brand" href="#">
        <img alt="Brand" src="~/Images/Logomarca_mini.jpg">
     </a>
  </div>
.....
    
26.05.2015 / 17:34