如何使用 HTML 和 CSS 在同一个 div 中创建三个框？

三个或更多不同的 div 可以在同一个 div 中使用 CSS 并排放置。这可以通过 flexbox 实现——但请注意，您需要使用包装 div 并为每个 div 应用不同的 flex-directions 以使网格布局工作。使用 CSS 属性设置 div 的高度和宽度。

句法：

flex: flex-grow flex-shrink flex-basis 
           | auto | initial | inherit;
flex-direction: row;
flex-direction: row-reverse;
flex-direction: column;
flex-direction: column-reverse;
flex-grow: number | initial | inherit;

示例：此示例说明如何使用常规 HTML 和 CSS 在同一个 div 中创建 3 个框。

  

    
  
    
  
    

  

    

        

            GeeksforGeeks 1
        
  
        

            GeeksforGeeks 2
        
  
        

            

                GeeksforGeeks 4
            
            

                

                    GeeksforGeeks 5
                
                

                    GeeksforGeeks 6
                
                

                    GeeksforGeeks 7
                
            
            

                GeeksforGeeks 8
            
        
    

  

Output: