为什么没有文本框与提交按钮内联对齐

Question

在我的wordpress网站上，我使用过bbpress插件。以下代码是渲染搜索框和提交按钮的责任。

<form role="search" method="get" id="bbp-search-form" action="<?php bbp_search_url(); ?>">
    <div>
        <label class="screen-reader-text hidden" for="bbp_search"><?php _e( 'Search for:', 'bbpress' ); ?></label>
        <input placeholder="Search <?php the_title(); ?> Topics" tabindex="<?php bbp_tab_index(); ?>" type="text"  style="width:400px;height:20px;"value="<?php echo esc_attr( bbp_get_search_terms() ); ?>" name="bbp_search" id="bbp_search"  />
        <?php if( $forum_id ): ?>
        <input class="button" type="hidden" name="bbp_search_forum_id" value="<?php echo $forum_id; ?>" />
        <?php endif; ?>
        <input tabindex="<?php bbp_tab_index(); ?>" class="button" type="submit" id="bbp_search_submit" value="<?php esc_attr_e( 'Search', 'bbpress' ); ?>" />
    </div>
</form>

但问题是当它在IE中渲染时，搜索框和按钮没有正确对齐。

见下面的截图。

但是，在localhost中也可以使用IE webbrowser。问题是我把它放到远程服务器上。我发现远程服务器是旧版本，而本地版本是最新版本。

除此之外，我使用jquery UI来渲染按钮样式。问题出在哪里？我需要升级服务器吗？