CSS“表格布局:固定”以及根据内部内容自动调整宽度的单元格

发布于 2024-12-23 16:34:21 字数 249 浏览 3 评论 0原文

如果内容比列宽,我对 table-layout:fixed 和内列宽度有问题。

看看我这里的样本: http://jsfiddle.net/H5FLm/

这个标记的主要思想是我需要具有自动宽度的居中列由内部内容物和侧面的液柱组成。

我愿意接受任何修复它或使用不同标记的建议。

谢谢。

I have a problem with table-layout:fixed and width of inner columns if their content wider than column.

Look at my sample here:
http://jsfiddle.net/H5FLm/

Main idea of this markup that I need centered column with auto-width by inner content and liquid columns on sides.

I'm opened for any suggestions to fix it or use different markup.

Thanks.

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(2

半世蒼涼 2024-12-30 16:34:21

我更喜欢使用自动换行而不是溢出。检查我的版本此处

添加了word-wrap:break-word;到内容类。

I prefer using word-wrap instead of overflow. Check my version here

Added word-wrap: break-word; to content class.

佼人 2024-12-30 16:34:21

看看这个布局,听起来这就是您正在寻找的:

当前布局不起作用的唯一原因是您选择使用字符串looooooooooooooong 作为示例文本。 HTML 不换行。从技术上讲,您可以执行 overflow:hidden; 并且 BOOM... 问题已解决。

如果您使用 loo oooooo oooooo ong,没问题。

Check out this layout, sounds like it's what you're looking for:

The only reason your current layout doesn't work is because of your choice to use the string looooooooooooooong as your sample text. HTML does not wrap letters. Technically you can do overflow: hidden; and BOOM... problem fixed.

Had you used loo oooooo oooooo ong, no problem.

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文