3

问题是我们的网站上会有很多不同的语言,动态文本长度未知。我需要将所有内容都居中,但无需像这样手动为每个区域添加右边距。如果它可以进行某种类型的 jQuery 计算并使其每次看起来都像这样但自动完成,那就太好了: 单击此处查看我的 CSS 示例

我尝试修改我找到的这个 jQuery 脚本,但我失败了,因为你可以在这里看到 jsfiddle.net/UTaSg/86/
如果它没有为最后一个孩子添加额外的宽度(“类型:所有独奏乐队”)。

我不确定如何做到这一点,任何帮助将不胜感激。提前感谢您的帮助!如果可能,请使用示例。

990px​​ 容器中总是会有这 4 个过滤器,我想在所有不同语言的末端保留 25px 的空间。所以它们的文本长度会略有变化,我希望 3 个过滤器空间之间的空间相等。

4

3 回答 3

0

这可能不是您所希望的,但如果您真的不知道每列过滤器的宽度或数量,那么我认为您应该考虑其他可能的设计。

这是过滤器下拉列表的主要候选者。是的,它没有那么酷,但它很实用。

另一种选择是在每列上设置固定宽度,然后用于text-overflow: ellipsis;处理文本溢出。这将帮助访问者了解有更多可用的过滤器,并且您可以使用一个小箭头图形来达成交易,单击该箭头图形会滑过以显示其他过滤器。像这样的东西:

在此处输入图像描述

我知道你要一把锤子,我给了你一根香蕉,所以我很抱歉,这没有用。

于 2012-08-17T03:29:28.320 回答
0

如果要使整个事物居中,则应width: 100%; margin: 0 auto;在正在执行的过滤器容器上使用。如果你想有相同的填充,你不需要.leftpositive, .leftnegative, .spacingforlanguage1. 你可以简单地做

.filter { padding-right: 2%; }
.filter:last-child { padding-right: 0; }

这样,它与您剩余的空间量有关,并且间距将相对相等。您还可以创建一个网格并设置任何给定过滤器可以容纳在容器中的最大宽度(例如,第一个过滤器的宽度为 33%,第二个过滤器的宽度为 25%,等等)。这是保持平衡的最佳方式,尤其是对于不同的浏览器宽度和设备。

于 2012-08-17T04:54:05.593 回答
0

您可以尝试简单地对每个文本的宽度求和,然后从整体的宽度中减去它,再乘以 3,并将其作为除最后一个元素之外的每个元素的右边距。

您可以创建通用插件,因为这将适用于任何数量的项目在具有长度的 jQuery 对象内,并且您可以使用 parent() 获取容器。

你可以试试这个:http: //jsfiddle.net/UTaSg/104/

于 2012-09-27T03:09:24.717 回答