Question

在我的网站http://clearwaterfloridabeachrentals2.imbookingsecure.com/底部有一个导航菜单和三个带图像的方框。它们不是居中而是左对齐。我可以用什么CSS代码来集中它？

这是我的CSS：

      .row-fluid {
          display: -webkit-box;
          display: -webkit-flex;
          display: -ms-flexbox;
          display: flex;
          }

     .textwidget {
         text-align: center
          }

添加.textwidget css修复了三个框，但菜单仍然是左对齐的。不确定哪些代码直接影响它。

Answer 1

在元素上使用text-align: center

Answer 2

使用text-align：center作为包裹三幅图像的div。

并使表格宽度=＆＃34; 100％＆＃34;用于导航菜单

Answer 3

Flexbox只能深入一级：

柔软的容器和弯曲的孩子。所以你需要将菜单设置为flex容器，然后 justify-content：center 子元素

在需要均匀间隔的子元素时，将 flex：1 添加到子元素。

但这可能不适合您的设计，因为它相当嵌套。

基本上，您的页脚是两列灵活行的列

菜单（需要以行为中心的8个弯曲列的行）
copyright（两列似乎需要间隔的弯曲列）

首先对此作出反应，以便我可以帮助您进一步重组

我可以操纵css使这些部分居中吗？

3 个答案: