CSS Overflow Marquee-Line和Floating Divs

Question

好吧，我正试图在屏幕上显示一排社交新闻。我遇到的问题是当我添加超过6个项目时，它会将它们放在一个新行上。我如何将它们分成一行并使用overflow：marquee-line来滚动它们？我会更好地使用Javascript吗？如果是，你知道任何脚本吗？

下面是我正在使用的图片：

这是我正在使用的css代码。

.social-media-mashup {
display:block;
width:100%;
height:150px;
overflow:marquee-line;
/* margin: 1em 0; */
}

.smm-item {
width:273px;
height:130px;
float:left;
margin-right:6px;
}

.smm-item p {
overflow:hidden;
height:48px;
}

.smm-item p.entry-meta {
overflow:hidden;
height:16px;
}

#anchor {
width:100%;
position:absolute;
bottom:0;
}

#rt-bottom { 
width:100%;
}

这是HTML结构。

<div id="anchor">
<div id="rt-bottom">
<div class="rt-container">
<div class="rt-grid-12 rt-alpha rt-omega">
<div id="smm-widget-2" class="widget social-media-mashup rt-block">
<!-- Social Media Mashup plugin by Brave New Media -->
<div class="social-media-mashup icons-grey">
    <!-- Social Media Mashup cache is enabled. Duration: 60 minutes -->

    <div class="smm-item smm-twitter">
        <p>Content</p>

        <p class="entry-meta">Meta</p>
    </div>

</div>
<!-- End Social Media Mashup plugin -->
</div>
</div>
<div class="clear"></div>
</div>
</div>

知道该怎么做？

Answer 1

可能是：

overflow-style: marquee-line;

或任何浏览器都不支持...

Nathan Rohler在线提供本教程：

http://www.tripwiremagazine.com/2011/07/jquery-tutorial-building-a-jquery-scroller.html

使用JQuery，你必须改变它以满足你的需求，但也许这就是你正在寻找的东西，或者你可以从JQuery找到一个插件......