css - 强制子元素宽度不要在弹性框内溢出

在此示例中，是否有任何方法可以限制容器div中的“ a”元素宽度，以使它永远不会在其右侧溢出，从而破坏任何换行的角色？

谢谢

body{background:#FFF;}
img{width:80px;}
.container{
 border:1px dashed #F00;
 width:120px;
 display:flex;flex-direction:row;
 /*align-self: flex-end;*/
 justify-content: flex-start;
}
a{display:inline-block;border:1px dashed #00C;margin:auto;white-space:pre-wrap;word-wrap: break-word;}

<body>
 <div class="container">
   <img class=picto src='https://upload.wikimedia.org/wikipedia/commons/4/47/PNG_transparency_demonstration_1.png'/>
   <a class="input">testtxtis longone</a> 
 </div> 
Shall be contained in container not overflow
</body>

强制子元素宽度不要在弹性框内溢出

0 个答案: