Jump to content
Sign in to follow this  
Mvrosking

Tab BootStrap nie wyświetla poprawnie zawartości

Recommended Posts

Cześć, tam taki kod na wyświetlanie tab pills bootstrap.

<div class="col-lg-7">
  <ul class="nav nav-tabs">
    <li class="active"><a data-toggle="tab" href="#sms1"><i class="fa fa-phone" aria-hidden="true"></i> SMS</a></li>
    <li><a data-toggle="tab" href="#paysafecard1"><i class="glyphicon glyphicon-credit-card"></i> PaySafeCard</a></li>
    <li><a data-toggle="tab" href="#paypal1"><i class="fa fa-paypal" aria-hidden="true"></i> PayPal</a></li>
    <li><a data-toggle="tab" href="#transfer1"><i class="fa fa-credit-card" aria-hidden="true"></i> Przelew</a></li>
  </ul>
  <div class="tab-content">
    <div id="sms1" class="tab-pane fade in active">
      <p style="margin-top:10px;" class="text-center">Aby zakupić <span class="label label-primary">VIP (30 dni)</span> wyślij SMS o treści <span class="label label-primary">MSMS.PROSV</span> pod numer <span class="label label-primary">7055</span></p>		
      <form method="post">
        <div class="form-group">
          <label for="formSMS_nick">Nick</label>
          <input type="text" name="formSMS_nick" class="form-control" placeholder="Wpisz nick gracz, dla którego chcesz zakupić usługę.">
        </div>
        <div class="form-group">
          <label for="formSMS_code">Kod SMS</label>
          <input type="text" name="formSMS_code" class="form-control" placeholder="Wpisz kod sms, który otrzymałeś.">
        </div>
        <div class="form-group text-center">
          <input name="buy_button_sms" type="submit" class="btn btn-primary" value="Zakup">
        </div>
      </form><hr>
      <p class="text-center">
        Płatności zapewnia firma <a href="http://microsms.pl/">MicroSMS</a>. <br/>
        Korzystanie z serwisu jest jednozanczne z akceptacją <a href="http://microsms.pl/partner/documents/">regulaminów</a>.<br/>
        Jeśli nie dostałeś kodu zwrotnego w ciągu 30 minut skorzystaj z <a href="http://microsms.pl/customer/complaint/">formularza reklamacyjnego</a><br/><br/>
        <img src="http://microsms.pl/public/cms/img/banner.png" style="width: 100%;">
      </p>
    </div>
    <div id="paysafecard1" class="tab-pane fade in active">
      <p style="margin-top:10px;" class="text-center">Aby zakupić <span class="label label-primary">VIP (30 dni)</span> za pomocą <span class="label label-primary">PaySafeCard</span> wypełnij pola poniżej.</p>
      <form method="post">
        <div class="form-group">
          <label for="formPSC_nick">Nick</label>
          <input type="text" name="formSMS_nick" class="form-control" placeholder="Wpisz nick gracz, dla którego chcesz zakupić usługę.">
        </div>
        <div class="form-group">
          <label for="formPSC_email">E-mail</label>
          <input type="text" name="formSMS_email" class="form-control" placeholder="Wpisz email, aby przejść do dalszego etapu.">
        </div>
        <div class="form-group text-center">
          <input name="buy_button_psc" type="submit" class="btn btn-primary" value="Zakup">
        </div>
      </form><hr>
    </div>
  </div>
</div>

I dlaczego gdy wejdę na stronę pierwszy raz, wszystkie taby wyświetlają się jeden pod drugim, ale gdy już przełączę to wyświetlają się poprawnie. Macie screena jak to wygląda.

Spoiler

 

Share this post


Link to post

Można zamknąć, sam znalazłem rozwiązanie ;).

Share this post


Link to post
Guest
This topic is now closed to further replies.
Sign in to follow this  
×
×
  • Create New...