在h2上添加保证金

Question

我正在尝试创建一个div，左边有一个按钮，右边有一个标题。看起来像这样：

但我得到的是这样的东西：

你可以看到有一个保证金被添加，我无法弄清楚原因。我已经检查了我能做的一切，而且我无法弄清楚我做错了什么。 （我知道h2是50％。我这样做是为了弄清楚为什么按下正确的按钮。）

这是我的HTML：

    <div class="day_buttons">
            <button id="previous_day"></button>
            <h2 id="zip_h2">What day and time would you like your stuff picked up?</h2>
            <button id="next_day"></button>
    </div><!--end nav_buttons--> 

这是随身携带的CSS：

#next_day
{
    float: right;
    background: transparent url(./images/icons/forward_button.gif) no-repeat top left;
    width:4em;
    height:4em;
    z-index:5;

}

#previous_day
{
    position:relative;
    top:0;
    left:0;
    float: left;
    background: transparent url(./images/icons/backward_button.gif) no-repeat top left;
    width:4em;
    height:4em;
    z-index:5;
}
.day_buttons
{
    height:3em;
    width:100%;
    display:inline-block;
}

#zip_h2
{
    width: 50%;
    margin:0px !important;
    overflow:hidden;
}

对于需要它的人来说，这是一个小提琴：http://jsfiddle.net/tK72Z/

Answer 1

H2元素块级，因此它总是会尝试填充“行”上100％的宽度，除非你告诉它不要。

只需将float:left添加到您的h2样式中即可。

Answer 2

我认为你正在寻找这样的东西。

#zip_h2
{
    width: 50%;
    margin: 0 auto;
    text-align: center;
}

OR

#zip_h2
{
    width: auto;
    text-align: center;
}

Answer 3

尝试这样：

HTML：

<div class="day_buttons">
    <button id="previous_day"></button>
    <h2 id="zip_h2">What day and time would you like your stuff picked up?</h2>
    <button id="next_day"></button>
</div>

CSS：

.day_buttons
{
  position: relative;
}

.day_buttons h2
{
  text-align: center;
}

.day_buttons button
{
  position: absolute;
  top: 10px;
}

.day_buttons #previous_day
{
  left: 0;
}

.day_buttons #next_day
{
  right: 0;
}

Answer 4

CSS的变化：

右键

#next_day
{
position: absolute;
float: right;
top: 10px;
right: 10px;
background: transparent url(right.jpg) no-repeat top left;
width:4em;
height:4em;
z-index:5;  
}   

标题

#zip_h2
{
margin:0px !important;
padding-left: 20px;
padding-right: 70px;
text-align: center;
overflow:hidden;
}

Answer 5

只是一个小小的改变

top: 0;
right: 0;

Working Fiddle