当前位置：网站首页>Word wrap when flex exceeds width

Word wrap when flex exceeds width

2022-07-07 02:04:00 【A diligent code dog】

design sketch

Insert picture description here 

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>flex Wrap over length </title>

    <style > .container{
       width: 700px; border: solid 1px black; display: flex; flex-wrap: wrap; } .container div{
       width: 200px; margin: 10px; height: 100px; background-color: aqua; flex-shrink: 0;/* Remove flex Sub element width averaging problem */ } </style>

</head>
<body>

    <div class="container">
        <div class="div1"></div>
        <div class="div2"></div>
        <div class="div3"></div>
        <div class="div4"></div>
        <div class="div5"></div>
    </div>
    
</body>
</html>
原网站

版权声明
本文为[A diligent code dog]所创，转载请带上原文链接，感谢
https://yzsam.com/2022/02/202202130908127870.html

边栏推荐

猜你喜欢

随机推荐