我通过Bootstrap将<a>
元素设置为按钮。我希望它下面的文本与按钮居中对齐。我该怎么做呢?我尝试使用<center>
标记将文本本身居中,但是这会将其移动到父级(<div id="parent">
)的中心,而不是按钮的中心。这就是我现在所拥有的:
<div id="parent">
<a href="/personalised-payment-page/" class="btn btn-info btn-lg btn-raised" style="max-width: 300px !important;">CREATE YOURS NOW</a><br>
<b style="color: #388e3c;">(FREE - LIMITED PERIOD)</b>
</div>
编辑:我应该强调,我根本不想让按钮移动,只需要下方的绿色<b>
文字,以便在按钮下居中。
答案 0 :(得分:4)
将以下CSS添加到您的页面。
#parent {
display: inline-block;
text-align: center
}
您还可以使用以下内容。我对你的其余代码知之甚少,无法确定最佳代码。
int categoryIdIndex = 7;
int productIdIndex = 3;
int quantityRequestedIndex = 5;
List<string> errors = new List<string>()
for (int index = 0; index < this.gridagree.Rows.Count; index++)
{
Row row = gridagree.Rows[index];
int categoryId = Convert.ToInt32(row.Cells[categoryIdIndex].Text);
int productId = Convert.ToInt32(row.Cells[productIdIndex].Text);
int quantityRequested = Convert.ToInt32(row.Cells[quantityRequestedIndex].Text);
int availableQuantity = s.getprodqun(productId);
if(quantityRequested > availableQuantity)
{
errors.Add(string.Format("Inventory contains insufficient items for product id {0} ", productId));
}
}
if(errors.Count == 0)
{
... process the orders ...
}
else
{
... show the errors
}
答案 1 :(得分:1)
使用<a>
属性将<b>
和display:inline-block
标记包裹在text-align:center
元素中:
<div id="parent">
<span style="display:inline-block;text-align:center;">
<a href="/personalised-payment-page/" class="btn btn-info btn-lg btn-raised" style="max-width: 300px !important;">CREATE YOURS NOW</a><br>
<b style="color: #388e3c;">(FREE - LIMITED PERIOD)</b>
</span>
</div>
OBS:避免使用内联样式
答案 2 :(得分:0)
<div>
<?php
function footer() {
$string = "</div>";
$string .= "<my-footer></my-footer>";
return $string;
}
if (isset($_POST["submitted"])) {
if (!isValidEmail($_POST["email"])) {
echo "<p>Please enter a valid email address.</p>";
die(footer()); // Displays footer
}
if (!isValidPhoneNumber($_POST["phoneNumber"])) {
echo "<p>Please enter a valid phone number.</p>";
die(footer()); // Displays footer
}
...
if (updateUser($id, $email, $phoneNumber, $name)) {
echo("<meta http-equiv='refresh' content='0'>");
} else {
die("<p>An error occurred! Could not update your profile information!</p>" . footer()); // kills the page execution, but still returns the foot of the page.
}
}
echo footer();
?>
答案 3 :(得分:0)
只需使用:
#parent {
text-align: center
}
正如已经说过的中心已被弃用。
答案 4 :(得分:0)
如果您希望明确地保持300px宽度的按钮,我会使用此模式:
<div id="parent">
<div style="max-width: 300px !important;" class="text-center">
<a href="/personalised-payment-page/" class="btn btn-info btn-lg btn-raised btn-block" >CREATE YOURS NOW</a>
<b style="color: #388e3c;">(FREE - LIMITED PERIOD)</b>
</div>
</div>