如何使用React和Bootstrap在下拉按钮下方的下拉菜单中移动？

Question

我试图添加一个简单的元素，其意图如下：

然而，当添加填充时，我似乎无法使其显示在基础之下，如下所示：

这是我的CSS：

.controls
  .dropdown-menu
    li
      border-top: 1px solid #B3B3B3
      cursor: pointer
      padding-bottom: 1em
      padding-top: 1em
      text-transform: capitalize

      &:hover
        background-color: #EEE

.controls
  section
    margin-bottom: 1em

  .form-control.searching
    background: url(xxx) 240px center no-repeat

  form.pull-right
    padding: 0

  .main .dropdown-component
    display: inline-block
    margin-right: 0.9em

    button:last-child
      min-width: 0

  .dropdown-menu

    margin-top: 50 px
    padding-left: 20 px

这是我的控制方案：

  render: function render() {
    return (
      <div className="controls col-lg-12">
        <section className="row">
          <div className="col-lg-8">
            <Dropdown
              secondary={this.toggle('showCreateDropdown')}
              caption={this.getIntlMessage('addContact')}
              primary={this.toggleForm('contactForm', 'uploadForm')}
              show={this.state.showCreateDropdown}
              fields={[{
                value: this.getIntlMessage('uploadMultiple'),
                action: this.toggleForm('uploadForm', 'contactForm')
              }]}
              className='dropdownFormat' />
            <a target="_blank"
              data-track="click"
              id="createNewsletter"
              data-action="navigate"
              href={this.props.gemUrl}
              className="btn btn-default newsletter"
              data-label="create-newsletter">
              {this.getIntlMessage('createNewsletter')}
            </a>

            <span className="left-padding">{this.getIntlMessage('totalCount')}: {this.props.count}</span>
          </div>

          <div className="col-lg-4">
            <form className="col-lg-10 pull-right" onSubmit={this.search}>
              <input
                id="searchBar"
                type="text"
                ref="filterTextInput"
                placeholder={this.getIntlMessage('search')}
                className={'form-control' + (this.state.searching ? ' searching' : '')}
                onChange={this.search} />
            </form>
          </div>
        </section>

        {this.renderForm()}
      </div>
    );
  }
});