Блог

Главная - Вопросы по программированию - Проблема с загрузочной таблицей с 17 столбцами, которая не реагирует

Проблема с загрузочной таблицей с 17 столбцами, которая не реагирует

#html #css #bootstrap-4 #bootstrap-5

Вопрос:

У меня есть простая таблица boostrap , которой у меня 17 <th> , Проблема в том, что они не могут поместиться должным образом рядом друг с другом. Из-за того, что bootstrap реагирует, это происходит.. Но все, что я хочу сделать, это: если <th> столбцы очень похожи на мой пример 17.. я хочу, чтобы появилась боковая панель Google chrome, просто прокрутите влево/вправо и все увидите.. Возможно ли это? Я оставлю фрагмент, чтобы посмотреть.

 <!DOCTYPE>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Βάση πελατών</title>
    <link type="text/css" href="css/style/style.css" rel="stylesheet"/>
    <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.4.1/css/bootstrap.min.css" integrity="sha384-Vkoo8x4CGsO3 Hhxv8T/Q5PaXtkKtu6ug5TOeNV6gBiFeWPGFN9MuhOf23Q9Ifjh" crossorigin="anonymous">
</head>
<body>

<div class="container-fluid shadow py-3 my-3">
    <table class="table table-striped table-hover">
        <thead>
        <tr>
            <th scope="col">Id</th>
            <th scope="col">name</th>
            <th scope="col">lastname</th>
            <th scope="col">password</th>
            <th scope="col">Email</th>
            <th scope="col">Entry to the control panel</th>
            <th scope="col">payment</th>
            <th scope="col">Home telephone</th>
            <th scope="col">mobile telephone</th>
            <th scope="col">Τ.Κ.</th>
            <th scope="col">AFM</th>
            <th scope="col">Job</th>
            <th scope="col">Δ.Ο.Υ.</th>
            <th scope="col">Website - Webpage - Office</th>
            <th scope="col">Testingggggggggggggggggggggggggg</th>
            <th scope="col">Comments</th>
            <th scope="col">Address</th>
            <th scope="col">City</th>
        </tr>
        </thead>

        <tbody>
       

        </tbody>
    </table>
</div>

</body>
</html>

Как вы можете видеть Entry to the control panel , и Website - Webpage - Office это ужасно

Комментарии:

1. Я не знаю, правильно ли я понял ваш вопрос, th {white-space: nowrap} ?

2. @павел да, это то, чего я хотел! Подумайте о том, чтобы ответить на мой вопрос, чтобы принять его и принять пуанты. Также извините за мой плохой английский, не стесняйтесь редактировать мой вопрос, чтобы помочь большему количеству людей, если они когда-нибудь столкнутся с этой проблемой.

3. Рад, что помог вам. Я отвечаю здесь не для того, чтобы получить больше репутации, мне не нужно переписывать снова в качестве ответа 😉

Метки: ,