html - 滚动时引导词缀一直向左浮动

Question

我在一个容器中有一个 div，我想将它固定在屏幕的右侧。但是当用户开始滚动时，它只是一直向左移动。谢谢你的帮助。

http://jsfiddle.net/kbLak/

<link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.2.1/css/bootstrap.min.css" rel="stylesheet">

最近的事情：

        </div>
    </div>
</div>
<div class="explore_recentAlbums" data-spy="affix" data-offset-top="20">
    <div class="ex_recentBar">
        <div class="ex_titleDetails">
            <span>recent stuff: </span>
        </div>
    </div>
    <table>
        <tr>
            <td>

                    <div class="well well-small" style="margin-bottom: 1px;">
                        <span>Recent</span>
                    </div>

                    <span class="NoDataFound">No Photo.</span>


                    <div class="smallalbumcover">
                        <div class="mosaic-blocksmall mofade">
                            <div class="mosaic-overlay">
                                <div class="details">
                                    <p>
                                        <a href="#">xzxz</a>
                                    </p>
                                </div>
                            </div>
                            <div class="mosaic-backdrop">
                                <img src=""/>
                            </div>
                        </div>
                        <div class="clearfix">
                        </div>
                    </div>

                    <div style="margin-bottom: 1em; text-align: center; margin-top: 10px;">
                        <a style="text-decoration: none;" href="/pics"><span class="label label-info">View More</span></a>
                    </div>

            </td>
        </tr>
        <tr>
            <td>

                    <div class="well well-small" style="margin-bottom: 1px;">
                        <span>Recent Video Albums</span>
                    </div>

                    <span class="NoDataFound">No Video.</span>

                    <div class="smallalbumcover">
                        <div class="mosaic-blocksmall mofade">
                            <div class="mosaic-overlay">
                                <div class="details">
                                    <p>
                                        <a href="/">test</a>
                                    </p>
                                </div>
                            </div>
                            <div class="mosaic-backdrop">
                                <img src="#"/>
                            </div>
                        </div>
                        <div class="clearfix">
                        </div>
                    </div>

                    <div style="margin-bottom: 1em; text-align: center; margin-top: 10px;">
                        <a style="text-decoration: none;" href="/vids"><span class="label label-info">View More</span></a>
                    </div>

            </td>
        </tr>
        <tr>
            <td>

                    <div class="well well-small" style="margin-bottom: 1px;">
                        <span>Recent P</span>
                    </div>

                    <span class="NoDataFound">No.</span>

                    <div class="smallalbumcover">
                        <div class="mosaic-blocksmall mofade">
                            <div class="mosaic-overlay">
                                <div class="details">
                                    <p>
                                        <a href="/">test</a>
                                    </p>
                                </div>
                            </div>
                            <div class="mosaic-backdrop">
                                <img src=""/>
                            </div>
                        </div>
                        <div class="clearfix">
                        </div>
                    </div>

                    <div style="margin-bottom: 1em; text-align: center; margin-top: 10px;">
                        <a style="text-decoration: none;" href="/aio"><span class="label label-info">View More</span></a>
                    </div>


            </td>
        </tr>
    </table>
</div>

​</p>

Answer 1

将此添加到您的 css 中，它将保持在右侧：

.explore_recentAlbums {
    right: 0;     
}