Как исправить bulma css, создав один макет столбца после разрыва в точке 768, где это должно было быть 2 столбца для планшетных устройств? - PullRequest
0 голосов
/ 23 марта 2019

Я пытаюсь сделать макет с помощью bulma css, и он делает макет из 1 столбца после разрыва в 768, то есть в режиме планшета, где в этот момент должно было быть 4 столбца, что здесь не так. Итак, как я могу сделать макет столбца, возможно, в 3 колонки, а затем в 2 колонки, а затем одну колонку для мобильных устройств.

Я пробовал поиск в Google и даже переполнение стека, но я не могу решить эту проблему. Я также попытался дать раздел в верхней части столбцов, но не получилось.

Это основной код столбца с сайта Bulma CSS, и это не то, что я хочу.

Первый столбец Второй столбец Третий столбец Четвертый столбец

Я перехожу из макета с 4 столбцами к макету с 1 столбцом, где должен быть макет с 4 столбцами, а затем макет с 3 столбцами, а затем с 2 столбцами, а затем с 1 столбцом. Изменить: я хочу, чтобы это работало с WordPress, но я не могу, если я не могу решить эту проблему.

1 Ответ

0 голосов
/ 26 марта 2019

Я нашел решение, и оно заключается в том, что этот код работает нормально для меня, и я хочу, чтобы он работал.

<div class="columns is-multiline  is-variable is-4">

    <div class="column is-4">
<div class=" ">

    <div class="card-image">
        <figure class="image is-4by3">
            <img src="myImage" alt="Placeholder image">
        </figure>
    </div>

    <p class="subtitle is-3 card-content has-text-centered">Subtitle 3</p>
    <p class="card-footer-item">hyee</p>
</div>
        <hr >
    </div>

</div>

И я сделал это в WordPress, просто поместив ту же структуру в том же порядке, но в WordPress

...