Savvas Nicholas Savvas Nicholas - 5 months ago 9
CSS Question

Text next to brand

How do I get the Bootstrap Brand and any accompanying text to be treated together as the brand?

I have tried this:

<nav class="navbar navbar-default">
<div class="navbar-header">
<div class="navbar-brand">
<a href="..." ><img class="img-responsive" src="/brand.png")?>"></a>
<h3>Ultimate Trade Sizer</h3>
</div>
</div>
</nav>


However, I can't get them to be aligned (i.e. side by side). It produces the below effect:

Title and logo should be side-by-side

Please note that I am using Bootrstrap 3.

Answer

Wrap the image in a span

<nav class="navbar navbar-default">
    <div class="navbar-header">
        <a class="navbar-brand" href="#">
            <span><img src="#"/></span>
            Ultimate Trade Sizer
        </a>
    </div>
</nav>

span defaults to display: inline