<!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 on item:property</title> ; <style> /* flex container */ .container { display: flex; height: 20rem; border: 1px solid #000; } /* flex item style (that is, child element) */ .container > .item { /* padding: 1rem; */ /* width: 10rem; Convenient Test the zoom functionality here It is recommended to use 100% instead of 10rem; */ width: 100%; background-color: lightcyan; border: 1px solid #000; /* Set whether the item is allowed to be enlarged 1 is allowed 0 is not allowed*/ /* flex-grow: 1 ;*//*Set the item whether it allows contraction*/flex-shrink: 1;/*Set the size of the item on the main axis space*//*Flex-base: 15rem;*/} /* flex 属性 */ </style> </head> <body> <div class="container"> <div class="item">item1</div> <div class="item">item2</div> <div class="item">item3</div> <div class="item">item4</div> </div> </body></html>
![[Web front-end] Node.js quick start](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
The code has been checked and can be scaled. Can you take a screenshot and show it to me, or check it to see what the problem is