移动div底部的跨度

时间:2012-10-21 20:37:14

标签: html css

只想在框底部移动“更多...”: enter link description here

  <div id="box1">
  <span class="more">More...</span>
  </div>


.more {
    margin: 4px 4px;
    left: 0px;
    bottom: 0px;
}

#box1 {
    float: left;
    margin: 10px auto;
    border-style: solid;
    border-width: 3px;
    border-color: #55fff3;
    height: 120px;
    width: 500px;
}

2 个答案:

答案 0 :(得分:5)

设置跨度上的绝对定位,以及边界框上的相对定位。

<div id="box1">
    <span class="more">More...</span>
</div>


.more {
    margin: 4px 4px;
    left: 0px;
    bottom: 0px;
    position: absolute;
}

#box1 {
    float: left;
    margin: 10px auto;
    border-style: solid;
    border-width: 3px;
    border-color: #55fff3;
    height: 120px;
    width: 500px;
    position: relative;
}

有关实例,请参阅Updated jsFiddle

答案 1 :(得分:2)

您可以将position: absolute用于more span

住:

http://jsfiddle.net/cHKF4/16/

您可以在此处查看使用位置

http://www.barelyfitz.com/screencast/html-training/css/positioning/