Question

我有<div id="SearchBox" name="Control" class="ms-floatLeft">。该类将SearchBox框强制在div中保持对齐。

有没有一种方法可以通过覆盖类来使SearchBox居中对齐？原因是我无法直接编辑HTML，但可以通过引用的样式表来更改对齐方式。

我尝试过：

div#SearchBox {
    width: 50%;
    margin: 0 auto;
}

没有成功。同样！important也无济于事，该类似乎总是优先。

我在这里可以做什么？

Answer 1

请尝试在ms-floatLeft类上进行编辑，因为这是原始样式的来源。

如果该类还具有边距样式，则它们将优先于您尝试进行的边距更改。但是，如果您使用！important，则您的样式将覆盖原始样式。

.ms-floatLeft {
    width: 50% !important;
    margin: 0 auto !important;
}

值得注意的是，并非总是建议！important，但是如果这是第三方CSS，并且您无权访问原始CSS文件，则可能别无选择。

Answer 2

类ms-floatLeft似乎表明该元素处于浮动状态（实际上，我只是通过查看SharePoint股票CSS来确认的）。在您的替代中取消此属性：

#SearchBox {
    float: none;
    width: 50%;
    margin: 0 auto;
}

Answer 3

我猜想因为应用类称为final defaultStyle = TextStyle(color: Colors.black); final blueStyle = TextStyle(color: Colors.blue); return Center( child: RichText( text: TextSpan( text: "c. 10\u{207B}\u{2076} seconds: ", style: defaultStyle, children: [ TextSpan(text: "Hadron epoch ", style: blueStyle, children: [ TextSpan( style: defaultStyle, text: "begins: As the universe cools to about 10\u{00B9}\u{2070} kelvin,", ), ]) ]), ), );，所以元素具有ms-floatLeft样式。将float: left;添加到您的float: none;

#SearchBox

Answer 4

尝试按以下步骤使其变得重要，但这可能不是最佳解决方案

div#SearchBox {
width: 50%;
margin: 0 auto;
align:center!important;

}

如何使用CSS覆盖类？

4 个答案: