Is there any way in restricting the "a" element width within the container div in this example so it nevers overflows on its right, so it breaks any caracter making a new line ?
Thanks
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>