Joomla模块垂直对齐

Question

我有自定义HTML模块，在 mainmenu 位置插入9个标记，如您所见www.jornaldalusofonia.pt

如何给它CSS指令，使其在条形图的中间保持垂直对齐。

谢谢你， Rui Farinha

Answer 1

使用Flex非常简单，只需执行以下操作：

#jsn-pos-mainmenu {
    float: left;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

然后删除表单输入上的额外边距：

.jsn-modulecontainer[class*="display-"] form {
    margin-top:0;
}

注意：您必须使用autoprefixer工具或您选择的任何工具为您的CSS添加前缀。另请注意，flexbox不适用于IE9及更低版本的旧版本，也适用于旧版本的safari。