Css HTML元素未居中

我的性别注册（注册页面的子页面未居中）出于某种原因，它停留在最左边？我需要它居中

.register-page {
  width: 100%;
  height: 100%;
  margin: auto;
  text-align: center;

  ...

  .gender-reg {
    border: solid yellow;
    @include scale-to-screen((
      margin-bottom: 10px
    ))
  }

<div class="gender-reg">
  <selection-dropdown params="all: allGenderChoices"></selection-dropdown>
</div>

。注册页面{
宽度：100%；
身高：100%；
保证金：自动；
文本对齐：居中；
...
.性别注册{
边框：纯黄色；
@包括缩放到屏幕((
边际下限：10px
))
}

---

基本上，除了这个元素，页面上的其他所有东西都居中。我不知道为什么！通常边距：自动居中。我卡住了！

100%的宽度将不会居中元素，因为没有额外的空间

如果将其设置为

50%

，则它将使元素在其父元素内居中

试试这个：

.register-page {
  width: 50%;
  height: 100%;
  margin: 0 auto;
  text-align: center;

---

你应该创建一个JSFIDLE，这样我们就可以看到它的行为。不可能，我在使用sassi添加了一个html位，它基本上只是一个围绕选择下拉列表的div。这只是一个自定义选择，但是使用lists@joe您可以在JSFIDLE上使用SASS。单击CSS部分中的cog图标，其中是

gender reg

元素？我在中看不到它你的HTML