html - Flexbox 无法使 Woocommerce 按钮居中

标签 html css wordpress woocommerce

我试图在我的 woocommerce 网站中将一个按钮居中,但没有成功。

这是我已经尝试过的:

margin: auto;
float: none;
display: block;

display: flex;
align-items: center;
justify-content: center;

image

我让它在没有 flexbox 的情况下工作,但没有响应,我需要学习更多 flexbox。

这是使用 flexbox 的结果:

image2

有人可以帮忙吗?如果需要,这是网站:http://svidro.recifeimage.com/

最佳答案

-你应该有一个<div>在里面你的<button> - <div>应该有这种风格

  display: flex;
  justify-content: center;

-这是因为标签的内容有

justify-content: center;

只会将它的内容居中 - 在这种情况下,您将拥有 <div>它的内容是<button>

关于html - Flexbox 无法使 Woocommerce 按钮居中,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/50766567/

相关文章:

css - 如何在存在内联和内部的情况下调用外部 CSS?

css - 需要检查这个 col-md(col-sm-4 col-md-4 col-lg-4) 说明

html - 为什么 col-xs-0 占据了 100% 的行宽?

PHP 在 WordPress 循环中的 DIV 内添加每 2 个项目

css - 在 wordpress 中的插件 css 之后加载自定义 css

php - onClick 重新加载 div 中的图像

javascript - JQuery获取 'id'属性

html - 如何格式化子菜单,使其横跨屏幕

html - 制作一个 div 展开以显示内容

html - 用户代理样式表覆盖表?