如何设置引导面板的大小？

So I am making a webpage using panels. The idea is to fetch rows from database and display it on panels. I set the width of the panel-primary to 15% and visually it resized the panel to 15%. I want to make the panel clickable so I added an (<'a'>) surrounding the panel to my surprise that even though the panel is visually 15% in size, it still takes the whole horizontal space. Notice the cursor is a hand

I attach my code for this part:

<?php
$sql = "SELECT * FROM pembelitkataku";
$result = mysqli_query($db, $sql);
while($row = $result->fetch_array())
{
?>
<a href="">
    <div class="panel panel-primary" style="width: 15%">
        <div class="panel-heading"><?php echo $row['text']; ?></div>
        <div class="panel-body"><?php echo "<img src = 'images/".$row['image']."' width=\"100\">"?></div>
    </div>
</a>
<?php
}
?>

My question is, how do I visually and physically change the panel size to 15% so that I can put multiple panels side by side?

Anchors are inline elements, not block level. you should put your anchors inside the panel div, not wrapping it.

Bootstrap panels will fit just fine inside Bootstrap's columns.

Try wrapping the full set of <a> tags in a <div class="container"> and <div class="row">, then give each <a> tag a column class like col-md-6 (two 50% width columns at larger screen sizes, switching to a single full-width column at smaller screen sizes).

Also, avoid using the hardcoded 15% width. Use the column classes to define the width, since Bootstrap's grid system is responsive by default.

Full example:

<div class="container">
<div class="row">
<?php
$sql = "SELECT * FROM pembelitkataku";
$result = mysqli_query($db, $sql);
while($row = $result->fetch_array())
{
?>
<a href="" class="col-md-2">
    <div class="panel panel-primary">
        <div class="panel-heading"><?php echo $row['text']; ?></div>
        <div class="panel-body"><?php echo "<img src = 'images/".$row['image']."' width=\"100\">"?></div>
    </div>
</a>
<?php
}
?>
</div>
</div>

UPDATE

To answer your specific question about 15% widths, try using the col-md-2 class on all the <a> tags. This actually ends up being 16.66666667%, but it will be visually similar to the 15% you wanted originally, while still letting you take advantage of Bootstrap's grid system so you can put multiple panels side by side. I updated my example to reflect this.