Login

Mekaboo · 05-07-2019, 07:56 PM

Hello again!

I understand this is a basic html but for some reason executing it with CI doesn't work the way I want it to work. Im trying to add Im trying to add Bootstrap Brand NavBar to site. Unfortunately I cant get it to flush left while main content on page is centered. How do I flush left the logo/brand in NavBar? This is the code I got from Bootstrap that I would love to use:

Code:
<!-- Image and text -->

<nav class="navbar navbar-light bg-light">

  <a class="navbar-brand" href="#">

    <img src="/docs/4.0/assets/brand/bootstrap-solid.svg" width="30" height="30" class="d-inline-block align-top" alt="">

    Bootstrap

  </a>

</nav>

,
Mekaboo

**InsiteFX** · 05-08-2019, 03:33 AM

See if this will work, I' am assuming that you are using Bootstrap 4

Code:
<body>

<header>

  <nav class="navbar navbar-expand-md navbar-light bg-light fixed-top">

    <a class="navbar-brand" href="#">

      <img src="/docs/4.3/assets/brand/bootstrap-solid.svg" width="30" height="30" class="d-inline-block align-top" alt="">

      Bootstrap

    </a>

    <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation">

      <span class="navbar-toggler-icon"></span>

    </button>

    <div class="collapse navbar-collapse" id="navbarCollapse">

      <ul class="navbar-nav mr-auto">

        <li class="nav-item active">

          <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a>

        </li>

      </ul>

    </div>

  </nav>

</header>

</body>

What did you Try? What did you Get? What did you Expect?

Joined CodeIgniter Community 2009. ( Skype: insitfx )

Mekaboo · 05-08-2019, 10:51 AM

(05-08-2019, 03:33 AM)InsiteFX Wrote: See if this will work, I' am assuming that you are using Bootstrap 4

Code:
<body> <header> <nav class="navbar navbar-expand-md navbar-light bg-light fixed-top"> <a class="navbar-brand" href="#"> <img src="/docs/4.3/assets/brand/bootstrap-solid.svg" width="30" height="30" class="d-inline-block align-top" alt=""> Bootstrap </a> <button class="navbar-toggler" type="button" data-toggle="collapse" data-target="#navbarCollapse" aria-controls="navbarCollapse" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarCollapse"> <ul class="navbar-nav mr-auto"> <li class="nav-item active"> <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a> </li> </ul> </div> </nav> </header> </body>

Unfortunately it doenst wok..still centered Sad

Thank you for the help!!