mirror of
				https://github.com/RGBCube/serenity
				synced 2025-10-31 20:22:45 +00:00 
			
		
		
		
	 141f56accc
			
		
	
	
		141f56accc
		
	
	
	
	
		
			
			Since grid item's containing block is not grid container but corresponding grid area, it affect positioning of abspos items.
		
			
				
	
	
		
			23 lines
		
	
	
		
			No EOL
		
	
	
		
			404 B
		
	
	
	
		
			HTML
		
	
	
	
	
	
			
		
		
	
	
			23 lines
		
	
	
		
			No EOL
		
	
	
		
			404 B
		
	
	
	
		
			HTML
		
	
	
	
	
	
| <!DOCTYPE html><style>
 | |
| * {
 | |
|     border: 1px solid black;
 | |
| }
 | |
| 
 | |
| .grid {
 | |
|     display: grid;
 | |
|     grid-template-columns: 100px 100px;
 | |
|     grid-template-areas: "a b";
 | |
|     position: relative;
 | |
|     width: 200px;
 | |
|     height: 100px;
 | |
| }
 | |
| 
 | |
| .abspos-item {
 | |
|     position: absolute;
 | |
|     top: 0;
 | |
|     left: 0;
 | |
|     width: 50px;
 | |
|     height: 50px;
 | |
|     grid-area: b;
 | |
| }
 | |
| </style><div class="grid"><div class="abspos-item"></div></div> |