CSS：使用边距定位组件

Question

在下图中，您可以看到我有两个标签help和Instructions，我想将这两个标签放在“帮助”标签当前所在的位置。当我使用margin-left:属性时，只有帮助按钮向左移动，instructions按钮保持在同一位置。

我用来配置这个css：

    .v-csslayout-topbarapplicant .v-button,
.v-csslayout-topbarapplicant .v-nativebutton,
.v-csslayout-topbarapplicant-invert .v-button,
.v-csslayout-topbarapplicant-invert .v-nativebutton {
    float: right;
    display: inline;
    margin-right:0px;
    margin-left: 268px;
    margin-top: -18px;
    padding: 0 3px 2px 0;

line-height: 11px;
    } 

如何更改间距以使两个标签（vaadin组件）一起移动？

Answer 1

您需要确保这两个项目都包含div。然后，您将margin-left设置为div，而不仅仅是其中一项。

无法在CSS中告知您发布了哪些项目正在被操作。如果这两个项目“帮助”和“说明”都在您发布的CSS中，那么您需要对其进行更改，以便两个项目都作为一个项目存在，这意味着在一个div中。如果您发布的CSS中只存在其中一个项目，那么您只能使用CSS操作其中一个项目，并且该项目是向右浮动的。确保两个物品沿同一方向浮动并包裹。将边距应用于此包装器div。

一般结构应如下所示：

CSS：

#help, #instructions {
       float: right; 
 }        

   div#wrapper {
       margin-left: 268px;
     ] /* wrapper containing both items, "help" and "Instructions" */

HTML：

<div id="wrapper">
   <div id="help"></div>
   <div id="instructions"></div>
</div>

Answer 2

我认为你有一些继承问题。 我建议首先检查这个属性所遵循的继承，如果你还有问题，我会为Help和Instructions创建单独的div，其中指令有不同的右边距。我希望这有帮助！这类问题很顽固。