![](/img/trans.png)
[英]Using bootstrap layout and there is extra unnecessary space on right side
[英]Move the widget to the right side of the web page using bootstrap 4
我希望信息标签位于网页的右侧。 其余的东西都在页面的中间。 虽然我无法将信息移到右侧。 此外,由于它,页脚消失了。 当我删除信息代码时,页脚有效。 请帮我右对齐信息小部件,也有页脚。
<div class="container">
<div class="card border-light mb-3 text-center">
<p class="card-header">Videos</p>
</div>
<div id="userSuccess" class="hide" role="alert">
<div id="successUserContent"></div>
</div>
<div class="row" id="userVid">
<?php
$allVid = Schema::getAll();
for ($i = 0; $i < count($allVid); $i++) {
echo <<<HTML
<div class="col-lg-4 col-md-6 mb-4">
<div class="card h-100">
<div class="card-body">
<a href="vid.php"><img class="card-img-top" src="http://placehold.it/700x400" alt=""></a>
<h4 class="card-title">{$allVid[$i]->getTitle()} </h4>
</div>
</div>
</div>
HTML;
}
?>
</div>
<div class="row">
<div class="col-md-4 order-md-2 mb-4">
<div class="card my-4">
<h5 class="card-header">Information</h5>
<div class="card-body">
<div class="row">
<ul class="list-unstyled mb-0">
<li>
...
</li>
</ul>
</div>
</div>
</div>
</div>
</div>
</div>
<?php
require_once './page/footer.php';
?>
对于右对齐,您需要在“row”类之后添加“justify-content-end”类。
<div class="row justify-content-end"><!-- ADDED HERE-->
<div class="col-md-4 order-md-2 mb-4">
<div class="card my-4">
<h5 class="card-header">Information</h5>
<!-- REST OF YOUR CODE-->
对于页脚,您需要将 URL 括在括号中。
<?php require_once('/yourdirectory/yourfooter.php'); ?>
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.