1

请考虑我的问题,我想让一系列图像表现得像非破坏性文本,

父元素- 它可以是任何元素,它可能有也可能没有固定宽度,所以基本上我不能对它应用任何 CSS。在大多数情况下,它是一个“td”标签。

child div - 这应该表现得像一个词,固定宽度无法确定,但具有固定高度作为图像高度,可以应用 css。

图像- 这应该像单词中的字符一样,具有固定宽度和与子 div 相同的固定高度。

这是 html 元素的正常盒模型行为,元素内的文本具有固定宽度。

|=======父元素========|
| 一些带有空格的中断文本 |
| 介于两者之间。|
| _ __ _ __ _ __ _ __ _ __ _ __ _ __ _ __ _ __ |

这是一种无法避免的情况,它会迫使父级增加其固定宽度。

|==============父元素============|
| |=============子 div ================| |
| |SomeUnbreakLongWordHavingNoSpaces| |
| | _ __ _ __ _ __ _ __ _ __ _ __ _ __ _ __ _ __ _ __ _ __ _ _ | |
| _ __ _ __ _ __ _ __ _ __ _ __ _ __ _ __ _ __ _ ___ __ _ ___ |

我希望我的图像之间没有空格的行为相同,但它的行为是这样的,

|=======父元素========|
| |=========子 div =========| |
| | |图片| |图片| |图片| |图片| | |
| | |图片| |图片| | |
| | _ __ _ __ _ __ _ __ _ __ _ __ _ __ _ ___| |
|
__ _ __ _ __ _ __ _ __ _ __ _ __ _ __ _ ___ |

图像和子 div 的高度是固定的,所以基本上任何额外的元素都应该水平向右推,但事实并非如此,请分享你关于这个问题的解决方案。

祝你今天过得愉快 !

4

2 回答 2

0

不确定它是否有效,但尝试添加width: 100%; overflow-x: auto;到 child-div 和float: left;图像。

于 2012-10-13T08:09:10.040 回答
0

检查模型word-wrap样式属性 将用于打破单词/内容将样式word-wrap:break-word;应用于子 div。

于 2012-10-13T08:11:28.503 回答