Image (Logo) that is in the menu and body of the site Bootstrap

Navigation
1

I would like your help to solve a problem. I'm learning and trying to draw with Bootstrap the image below:

ButIcannotdoit.Thefollowingishappening:

I'mjustusingthiscodesofar:

<navclass="navbar  navbar-default">
        <div class="container">
            <div class="navbar-header">

                <a class="navbar-brand" href="index.html"> <img src="images/Logo.png"></a>
                <!--  <a class="navbar-brand" href="#">Project name</a> -->
            </div>
            <div id="navbar" class="collapse navbar-collapse">
                <ul class="nav navbar-nav navbar-right">
                    <li class="active"><a href="#">Página inicial</a></li>
                    <li><a href="#about">Download</a></li>
                    <li><a href="#contact">Sobre</a></li>
                    <li><a href="#contact">Suporte</a></li>
                    <li><a href="#contact">Termos</a></li>
                </ul>
            </div><!--/.nav-collapse -->
        </div>
    </nav>


    <div class="container text-center">
        <div class="row">
        <img src="images/intro1.png" alt="Bird">
        </div>
    </div>
    
asked by anonymous 06.11.2015 / 00:36

1 answer

0

As you have not posted any css I will assume that the only problem is the distance of the blue banner from the header. It would not be in relation to the logo, because it must be with absolute position to be able to overlap the other elements.

With this you can increase (or define, if you have not done) the margin-bottom of the header, in this way you can lower it without the logo being over.

Another solution would be to create a <div class="row"> between the header and the blue banner, and yes, within that div you insert the logo with a css property of translate (to move the logo slightly up) or position:absolute to put it higher too.

But as I said, try to put a fiddle or some css code to know how the behavior is.

    
06.11.2015 / 12:23
Move Images from one screen to another Android Send text with Client Socket from one form that is displayed above another Form that is always on top