我需要将文本放在单行滚动 div 中，适合两个 div。
目标是让所有人都适合一条线！
编辑：我想我不够具体，我需要链接和文本放在同一行。这样，滚动是垂直的。
编辑：这是现在最接近我需要的。仅缺少滚动方面。http://jsfiddle.net/BKvzV/4/
问问题
8730 次
6 回答
5
如果我没看错的话，你不需要打破你的文本，而是继续前进，永远不要离开第 1 行，所以你可以像这样使用 CSS：
你的 CSS 更新了
#flash {
float:left;
width: auto;
font-size: small;
font-style: italic;
text-align: center;
white-space:nowrap;
}
不同之处在于white-space:nowrap；
对于谁看不到它：
编辑考虑编辑的问题问题！
编辑考虑页脚内的所有 div 必须并排的事实！
更新的小提琴！
请注意，此解决方案使用 Jquery 实时收集每个 div 的宽度并汇总在一起以设置页脚 div。没有它，就做不成！
编辑使所有 3 个 div 在包装器宽度内并排
在 Fiddle 示例中，包装器是主体
于 2012-05-10T20:28:54.603 回答
0
据我所知，当 3 个 div 都设置为width:auto;. 即使您使用overflow, 或in-line, 或到目前为止建议的其他方法，我认为左侧 div 将始终占用它需要的空间，然后是中间，然后是右侧......除非您使用设置宽度
我不知道这是否可能，因为您使用的是width:auto;. 这似乎允许 div 尽可能多地扩展，从而使其太大而不能只放在一行中。
如果您将链接更改为设置大小，例如width:10%，则其中 4 个链接会留下 60%，因此您可以将其设置#flash {width:60%; overflow-x:auto;}为可滚动和一行
于 2012-05-10T20:23:07.073 回答
0
#flash {
float:left;
width: auto;
font-size: small;
font-style: italic;
text-align: center;
white-space:nowrap; /* will put text in 1 line */
overflow-x:scroll; /* will add horizontal scroll bar should the length exceed the container */
}
于 2012-05-10T20:28:18.637 回答
0
#flash {
float:left;
width: auto;
font-size: small;
font-style: italic;
text-align: center;
/*These lines do the trick*/
overflow-x: scroll;
white-space: nowrap;
width: 100%;
}
于 2012-05-10T20:32:32.507 回答
0
使用 JQuery，我让中间 div 根据左右 div 改变大小。
jQuery：
$(function () {
var midWidth = $(document).width() - ($('#left').width() + $('#right').width());
$('#flash').width(midWidth);
});
希望这可以帮助。
编辑：添加到 div 的 css 中：
height: 36px;
overflow: scroll;
它更接近你可能想要的。
我不知道如何让盒子只显示一行。
于 2012-05-10T21:16:38.927 回答
-1
删除浮动：左
#flash {
font-size: small;
font-style: italic;
text-align: center;
white-space:nowrap;
overflow-x:scroll;
}
试试这个：
于 2012-05-10T20:44:47.130 回答