将图像居中并向右浮动另一个图像

时间:2013-01-21 23:04:51

标签: css

我想有一个带有两个图像的div。一个在页面上,另一个在右边。

我尝试将'align:center'添加到div中,这使图像居中。现在当我添加另一个图像并应用它:'float:right'时,第二个图像稍微向右移动。所以现在它在图像和页面左侧之间居中,而不是整个页面。

<div class="navigator" id="basket_status2" align="center">

<a href="javascript:void(0);">
<img src="images/icon/check-out_empty.png" border="0" alt=""></a>


<span style="float: right; ><a href="javascript:history.back();">
<img src="images/back_button.png" border="0" alt="" /></a></span>

</div>

1 个答案:

答案 0 :(得分:1)

无需处理花车。只需根据自己的喜好定位按钮:

.navigator {
    width            : 100%;
    height           : 20px;
    background-color : yellow;
    position         : relative;
}

.checkout {
    margin   : auto;
    height   : 20px;
    width    : 20px;
    border   : 1px solid green;
    position : relative;
    display  : block;
}

.back_button {
    height   : 20px;
    width    : 20px;
    border   : 1px solid red;
    position : absolute;
    right    : 0;
    top      : 0;
}

演示:http://jsfiddle.net/NJsvM/