Balkan SA:MP

Ostalo => Development => Izrada stranica i aplikacija - HTML, CSS, Javascript => Temu započeo: LoOdaK poslato Mart 17, 2017, 20:13:24 POSLE PODNE

Naslov: [Bootstrap] Pomoc oko navbar
Poruka od: LoOdaK poslato Mart 17, 2017, 20:13:24 POSLE PODNE
Pa ovako nesto ja kobajagi poceo pravit za skolu neku str, ali ocu i malo bootstrap-a ubacit, ubacio sam navbar ali postoji li mogucnost da taj text centriram na sredinu navbar-a  ??
Naslov: Odg: [Bootstrap] Pomoc oko navbar
Poruka od: LeSoN poslato Mart 18, 2017, 11:33:04 PRE PODNE
evo ti primjer
Ako si mislio na ovo

HTML

<nav class="navbar navbar-default" role="navigation">
  <div class="container-fluid">
    <!-- Brand and toggle get grouped for better mobile display -->
    <div class="navbar-header">
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#bs-example-navbar-collapse-1">
        <span class="sr-only">Toggle navigation</span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
        <span class="icon-bar"></span>
      </button>
      <a class="navbar-brand" href="#">Brand Logo</a>
    </div>

    <!-- Collect the nav links, forms, and other content for toggling -->
    <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1">
      <ul class="nav navbar-nav">
        <li class="pull-left"><a href="#">Dashboard</a></li>
        <li class="active"><a href="#">Stories</a></li>
        <li><a href="#">Videos</a></li>
        <li><a href="#">Photos</a></li>
        <li class="social pull-right"><a href="#">Social Links</a></li>
      </ul>
    </div><!-- /.navbar-collapse -->
  </div><!-- /.container-fluid -->
</nav>


CSS

  .navbar-nav {
    width: 100%;
    text-align: center;
    > li {
      float: none;
      display: inline-block;
    }
  }

Naslov: Odg: [Bootstrap] Pomoc oko navbar
Poruka od: LoOdaK poslato Mart 18, 2017, 16:11:48 POSLE PODNE
Ne radi brt ovo evo ti kod pa vidi sta ne valja ja sam botara za ovo

[pawn].navbar-text {
            width: 100%;
            text-align: center;
            }
        </style>
        <nav class="navbar navbar-default">
          <div class="container-fluid">
            <div class="navbar-header">
                <p class="navbar-text">BOT SAM</p>
            </div>
          </div>[/pawn]
Naslov: Odg: [Bootstrap] Pomoc oko navbar
Poruka od: Golub poslato Mart 22, 2017, 21:09:30 POSLE PODNE
Osim sto nisi otvorio <style> tag 'BOT SAM' stoji na sredini stranice.
Naslov: Odg: [Bootstrap] Pomoc oko navbar
Poruka od: CADILAB poslato Mart 22, 2017, 21:25:06 POSLE PODNE
<div class="container"> umesto container-fluid, to ce ti staviti content nesto kao na fazon kod facebooka, ti mozes onda dodati nesto u fazonu class="pull-right" da ga povuces jos desno
Naslov: Odg: [Bootstrap] Pomoc oko navbar
Poruka od: #Kasperzi poslato Mart 23, 2017, 03:44:30 PRE PODNE
Ja mislim da ti ovo treba :)


<nav class="navbar navbar-default" role="navigation">
<div class="navbar-collapse collapse">
<ul class="nav navbar-nav navbar-center">
<li><a href="#">Text</a></li>
<li><a href="#">Text</a></li>
<li><a href="#">Text</a></li>
</ul>
</div>
</nav>


CSS:

@media (min-width: 768px) {
.navbar-nav.navbar-center {
   position: absolute;
   left: 50%;
   transform: translatex(-50%);
  }
}