我如何使我的内容横向出现？

Question

我想水平显示我的内容（图像和一些描述）（每行3个）。目前，它垂直显示内容。

下面是我的代码:

$display_content .= '
    <div class="container mt-5 text-center">
        <div class="d-inline">
            <img src="'.$sub_row["poster_url"].'" class="img-responsive img-thumbnail"/>
            <h4>'.$sub_row["title"].'</h4>
            <p>'.$sub_row["description"].'</p>
            <p>'.$sub_row["duration"].'</p>
        </div>
    </div>
    ';

Answer 1

您可以使用bootstrap.flex-row设置水平方向

$display_content .= '
    <div class="container mt-5 text-center">
        <div class="d-flex flex-row">
           <div class="p-2">
            <img src="'.$sub_row["poster_url"].'" class="img-responsive 
             img-thumbnail"/>
           </div>
        <div class="p-2">
            <h4>'.$sub_row["title"].'</h4>
            <p>'.$sub_row["description"].'</p>
            <p>'.$sub_row["duration"].'</p>
        </div>

        </div>
    </div>
    ';