Warning: file_get_contents(/data/phpspider/zhask/data//catemap/7/elixir/2.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Html 图片标题和列表的CSS溢出问题_Html_Css_Overflow_Responsive - Fatal编程技术网

Html 图片标题和列表的CSS溢出问题

Html 图片标题和列表的CSS溢出问题,html,css,overflow,responsive,Html,Css,Overflow,Responsive,这是否可能使用css…我也尝试使用绝对和相对。。。但它只适用于左:0和右:0。。。但底部和顶部的高度几乎等于0。。。它不需要任何价值或可伸缩性 在inspect element中进行测试和实验时…(我忘了我在做什么…无法重新创建) 我能够做一些省略号,但使用100%宽度,这仍然不是我想要的结果,因为它包括了代码的左侧部分或图片部分,以使宽度相等。。。它会导致…/省略号,但仍会溢出。。。我需要帮助 先谢谢你 <!-- I Want Responsive :( Overall

这是否可能使用css…我也尝试使用绝对和相对。。。但它只适用于左:0和右:0。。。但底部和顶部的高度几乎等于0。。。它不需要任何价值或可伸缩性

在inspect element中进行测试和实验时…(我忘了我在做什么…无法重新创建) 我能够做一些省略号,但使用100%宽度,这仍然不是我想要的结果,因为它包括了代码的左侧部分或图片部分,以使宽度相等。。。它会导致…/省略号,但仍会溢出。。。我需要帮助

先谢谢你

<!--
    I Want Responsive :(
    Overall Box is 330px
    So The Header and Items must be around 280
    Picture is 50px only
    Items must be scalable in height... it can be more like e.g 20items

    PROBLEM
----------------------------
| Pic | Header             |
| tu  | ------------------ |
| re  | Item 1             |
|     | Item 2             |
|     | Item 3333333333333333333333333 | <- Overflow
|     | Item 4             |
|     | Item 5             |
----------------------------

    EXPECTED RESULT
----------------------------
| Pic | Header             |
| tu  | ------------------ |
| re  | Item 1             |
|     | Item 2             |
|     | Item 3333333333... | <- TextOverflow
|     | Item 4             |
|     | Item 5             |
----------------------------
-->


这可能吗?如果可能的话,我宁愿避免在css中使用calc,比如100%-50px…强迫症问题

这样做是否可行?改为在锚定标记上设置溢出

.container{
最大宽度:300px;
高度:300px;
显示器:flex;
溢出:隐藏;
}
div{
边框:1px纯黑;
}
.名单{
柔性生长:2;
最大宽度:100%;
}
.列表容器{
最大宽度:50%;
显示器:flex;
弯曲方向:立柱;
}
a{
空白:nowrap;
溢出:隐藏;
文本溢出:省略号;
}

图画
标题

否,如果将文本加长,则会出现问题,如。。项目333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333。它超出了界限和范围longer@user3492648我刚刚编辑了这个片段,添加了一些最大宽度属性。所以,您要查找的是文本要换行吗?如果这正是您所追求的,那么您应该避免使用flexbox,并查看
wordwrap
css属性。