CSS Sticky Bar - 无法放置在中间

Question

我在Wordpress中制作了一个粘性条，但是我无法将搜索表单+一些图像放在条的中间&右侧的相邻位置。任何帮助表示赞赏。

搜索表单：

<form method="get" id="searchform" action="<?php echo esc_url(home_url('/')); ?>" role="search"> 
    <label for="s" class="assistive-text"><?php _e('Search', 'boom'); ?></label> 
    <input type="text" class="field" name="s" value="Search for.. <?php echo esc_attr(get_search_query()); ?>" id="s" placeholder="<?php esc_attr_e('Search &hellip;', 'boom'); ?>" onblur="onBlur(this)" onfocus="onFocus(this)" /> 
    <input type="submit" class="submit" name="submit" id="searchsubmit" value="<?php esc_attr_e('Search', 'boom'); ?>" /> 
</form> 

粘杆：（我不得不添加了DIV ID searchform，因为否则它不会继续搜索表单+图像在同一行..）

<div id="sticky-header"> 
<div id="sticky-header-title"> 
    <a href="<?php echo bloginfo('url'); ?>" title="<?php bloginfo('description'); ?>"><?php echo $thsp_sticky_header_title; ?></a> 
</div> 
<div id="sticky-header-menu"><div id="searchform"> 
    <img src="http://localhost/public_boom/wp-content/uploads/Button-100x100.png" width="25" height="25" /> 
    <img src="http://localhost/public_boom/wp-content/uploads/Button-100x100.png" width="25" height="25" /> 
    <img src="http://localhost/public_boom/wp-content/uploads/Button-100x100.png" width="25" height="25" /> 
    <img src="http://localhost/public_boom/wp-content/uploads/Button-100x100.png" width="25" height="25" /> 
    <?php get_search_form(); ?> 
</div></div></div> 

CSS：

#sticky-header { 
    margin-top: -200px; 
    padding: 8px 11px; 
    position: fixed; 
    top: 0; 
    left: 0; 
    width: 100%; 
    z-index: 99998; 
    box-sizing: border-box; 
    -moz-box-sizing: border-box; 
    border-bottom: 1px solid rgba(0, 0, 0, 0.1); 
    border-width: 1px 1px; 
    opacity:0.9; 
    filter:alpha(opacity=90); /* For IE8 and earlier */ 
    -moz-box-shadow: 0px 15px 10px -10px #9F9F9F; 
    -webkit-box-shadow: 0px 15px 10px -10px #9F9F9F; 
    box-shadow: 0px 15px 10px -10px #9F9F9F; 
} 
#sticky-header-title { 
    float: left; 
    font-size: 22px; 
    line-height: middle; 
    margin: 0 !important; 
} 
#sticky-header-menu { 
    float: right; 
    text-align: right; 
    margin: 0 !important; 
} 
#searchform form { 
    display: inline; 
    line-height: middle; 
} 

打印屏幕：http://oi44.tinypic.com/2113y0z.jpg无论是搜索栏或图像是在中间酒吧（从上到下）的

Answer 1

我不能把搜索表单+在栏的中间部分图像彼此相邻 在酒吧&右侧

不完全确定这是什么意思，但：

要在右侧显示搜索表单，您可以使用float: right。尝试添加到您的CSS文件

#searchform { 
    float: right; 
}