CSS Overflow Marquee-Line和Floating Div

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中找到一个插件……