Tabela niszczy układ strony, ponieważ jest poziomy pasek przewijania o parę px. Jak to naprawić?

Odpowiedz Nowy wątek
2019-05-12 02:26
0

Doszedłem do wniosku, że tabela mi wszystko psuje, bo jak jej nie ma to jest ok, ale jak tylko ją dodaję, to niestety, ale pojawia się poziomy pasek przewijania strony dosłownie o parę px. CSS również na błąd nie wpływa, bo sprawdziłem wywalając go. Jak to naprawić, co zrobiłem źle?

<div class="row">
    <div class="col-6 offset-3">
        <table class="table table-bordered text-white">
            <thead class="header">
            <tr>
                <th scope="col">#</th>
                <th scope="col">Nazwa</th>
                <th scope="col">Cena netto</th>
                <th scope="col">Podatek</th>
                <th scope="col">Czynność</th>
            </tr>
            </thead>
            <tbody>
                <tr>
                    <td>John</td>
                    <td>Doe</td>
                    <td>[email protected]</td>
                    <td>0.23</td>
                    <td>
                        <button class="btn btn-sm bg-success">Wyświetl</button>
                        <button class="btn btn-sm bg-warning">Edytuj</button>
                        <button class="btn btn-sm bg-danger">Usuń</button>
                    </td>
                </tr>
                <tr>
                    <td>John</td>
                    <td>Doe</td>
                    <td>[email protected]</td>
                    <td>0.23</td>
                    <td>
                        <button class="btn btn-sm bg-success">Wyświetl</button>
                        <button class="btn btn-sm bg-warning">Edytuj</button>
                        <button class="btn btn-sm bg-danger">Usuń</button>
                    </td>
                </tr>
                <tr>
                    <td>John</td>
                    <td>Doe</td>
                    <td>[email protected]</td>
                    <td>0.23</td>
                    <td>
                        <button class="btn btn-sm bg-success">Wyświetl</button>
                        <button class="btn btn-sm bg-warning">Edytuj</button>
                        <button class="btn btn-sm bg-danger">Usuń</button>
                    </td>
                </tr>
            </tbody>
        </table>
    </div>
</div>

Pozostało 580 znaków

2019-05-12 02:57
1

Mmm... ale czy to jest istotne, by umieszczać tabelę w Bootstrap'owym gridzie (row, col)?

Wywaliłem i dodałem table-responsive i działa tak jak powinno. - Mateusz23 2019-05-12 14:40
Ok. Właśnie ten grid coś mieszał, ale nie sprawdzałem, co, bo w sytuacji. gdybyś go nie chciał, nie byłoby to potrzebne. - Silv 2019-05-12 16:09

Pozostało 580 znaków

2019-05-12 03:32
1

Nie rozumiem natury problemu.

W każdej rozdzielczości ci się ten pasek przewijania pojawia czy jak?


Wiesz co, tak. Niezależnie od PX, VW itp, ale problem rozwiązany. Wywaliłem col i row i dodałem table-responsive. - Mateusz23 2019-05-12 14:42

Pozostało 580 znaków

2019-05-12 10:32
1

W dokumentacji jest napisane, że aby tablica była responsywna, trzeba dodać klasę table-responsive.

<div class="table-responsive">
  <table class="table">
    ...
  </table>
</div>

Pomogło dzięki. - Mateusz23 2019-05-12 14:42

Pozostało 580 znaków

Odpowiedz
Liczba odpowiedzi na stronę

1 użytkowników online, w tym zalogowanych: 0, gości: 1, botów: 0