Pane width
Use a value between 19% and 30%
<div _="@=2503,dis=none"><div _="@=2504,dis=none,[@=2505]"><!DOCTYPE html> <html lang="en"> <head> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" integrity="sha512-iecdLmaskl7CVkqkXNQ/ZH/XLlvWZOJyj7Yy7tcenmpD1ypASozpmT/E0iPtmFIB46ZmdtAc9eNBvH0H/ZpiBw==" crossorigin="anonymous" referrerpolicy="no-referrer" />" <title>chess</title> <style> .blk{ background-color: black; width: 50px; height: 50px; float: left; font-size: 25px; } .wt{ background-color: rgb(102, 236, 196); width: 50px; height: 50px; float:left; font-size: 25px; } .con{ width:400px; height:400px; padding:5px; border: 5px double gold; margin: auto; position:relative ; top:30px; text-align: center; } .x{ color:rgb(10, 39, 204); padding-top:12px; } .y{ color: tomato; padding-top: 12px; } </style> </head> <body> <div class="con"> <div class="row"> <div class="wt"><i class="fa-solid fa-chess-rook y"></i></div> <div class="blk"><i class="fa-solid fa-chess-knight y"></i></div> <div class="wt"><i class="fa-solid fa-chess-bishop y"></i></div> <div class="blk"><i class="fa-solid fa-chess-queen y"></i></div> <div class="wt"><i class="fa-solid fa-chess-king y"></i></div> <div class="blk"><i class="fa-solid fa-chess-bishop y"></i></div> <div class="wt"><i class="fa-solid fa-chess-knight y"></i></div> <div class="blk"><i class="fa-solid fa-chess-rook y"></i></div> </div> <div> <div class="blk"><i class="fa-solid fa-chess-pawn y"></i></div> <div class="wt"><i class="fa-solid fa-chess-pawn y"></i></div> <div class="blk"><i class="fa-solid fa-chess-pawn y"></i></div> <div class="wt"><i class="fa-solid fa-chess-pawn y"></i></div> <div class="blk"><i class="fa-solid fa-chess-pawn y"></i></div> <div class="wt"><i class="fa-solid fa-chess-pawn y"></i></div> <div class="blk"><i class="fa-solid fa-chess-pawn y"></i></div> <div class="wt"><i class="fa-solid fa-chess-pawn y"></i></div> </div> <div class="row"> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> </div> <div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> </div> <div class="row"> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> </div> <div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> </div> <div class="row"> <div class="wt"><i class="fa-solid fa-chess-pawn x"></i></div> <div class="blk"><i class="fa-solid fa-chess-pawn x"></i></div> <div class="wt"><i class="fa-solid fa-chess-pawn x"></i></div> <div class="blk"><i class="fa-solid fa-chess-pawn x"></i></div> <div class="wt"><i class="fa-solid fa-chess-pawn x"></i></div> <div class="blk"><i class="fa-solid fa-chess-pawn x"></i></div> <div class="wt"><i class="fa-solid fa-chess-pawn x"></i></div> <div class="blk"><i class="fa-solid fa-chess-pawn x"></i></div> </div> <div> <div class="blk"><i class="fa-solid fa-chess-rook x"></i></div> <div class="wt"><i class="fa-solid fa-chess-knight x"></i></div> <div class="blk"><i class="fa-solid fa-chess-bishop x"></i></div> <div class="wt"><i class="fa-solid fa-chess-queen x"></i></div> <div class="blk"><i class="fa-solid fa-chess-king x"></i></div> <div class="wt"><i class="fa-solid fa-chess-bishop x"></i></div> <div class="blk"><i class="fa-solid fa-chess-knight x"></i></div> <div class="wt"><i class="fa-solid fa-chess-rook x"></i></div> </div> </div> </body> </html></div></div><!DOCTYPE html> <html lang="en"> <head> <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.4.0/css/all.min.css" integrity="sha512-iecdLmaskl7CVkqkXNQ/ZH/XLlvWZOJyj7Yy7tcenmpD1ypASozpmT/E0iPtmFIB46ZmdtAc9eNBvH0H/ZpiBw==" crossorigin="anonymous" referrerpolicy="no-referrer" />" <title>chess</title> <style> .blk{ background-color: black; width: 50px; height: 50px; float: left; font-size: 25px; } .wt{ background-color: rgb(102, 236, 196); width: 50px; height: 50px; float:left; font-size: 25px; } .con{ width:400px; height:400px; padding:5px; border: 5px double gold; margin: auto; position:relative ; top:30px; text-align: center; } .x{ color:rgb(10, 39, 204); padding-top:12px; } .y{ color: tomato; padding-top: 12px; } </style> </head> <body> <div class="con"> <div class="row"> <div class="wt"><i class="fa-solid fa-chess-rook y"></i></div> <div class="blk"><i class="fa-solid fa-chess-knight y"></i></div> <div class="wt"><i class="fa-solid fa-chess-bishop y"></i></div> <div class="blk"><i class="fa-solid fa-chess-queen y"></i></div> <div class="wt"><i class="fa-solid fa-chess-king y"></i></div> <div class="blk"><i class="fa-solid fa-chess-bishop y"></i></div> <div class="wt"><i class="fa-solid fa-chess-knight y"></i></div> <div class="blk"><i class="fa-solid fa-chess-rook y"></i></div> </div> <div> <div class="blk"><i class="fa-solid fa-chess-pawn y"></i></div> <div class="wt"><i class="fa-solid fa-chess-pawn y"></i></div> <div class="blk"><i class="fa-solid fa-chess-pawn y"></i></div> <div class="wt"><i class="fa-solid fa-chess-pawn y"></i></div> <div class="blk"><i class="fa-solid fa-chess-pawn y"></i></div> <div class="wt"><i class="fa-solid fa-chess-pawn y"></i></div> <div class="blk"><i class="fa-solid fa-chess-pawn y"></i></div> <div class="wt"><i class="fa-solid fa-chess-pawn y"></i></div> </div> <div class="row"> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> </div> <div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> </div> <div class="row"> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> </div> <div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> <div class="blk"></div> <div class="wt"></div> </div> <div class="row"> <div class="wt"><i class="fa-solid fa-chess-pawn x"></i></div> <div class="blk"><i class="fa-solid fa-chess-pawn x"></i></div> <div class="wt"><i class="fa-solid fa-chess-pawn x"></i></div> <div class="blk"><i class="fa-solid fa-chess-pawn x"></i></div> <div class="wt"><i class="fa-solid fa-chess-pawn x"></i></div> <div class="blk"><i class="fa-solid fa-chess-pawn x"></i></div> <div class="wt"><i class="fa-solid fa-chess-pawn x"></i></div> <div class="blk"><i class="fa-solid fa-chess-pawn x"></i></div> </div> <div> <div class="blk"><i class="fa-solid fa-chess-rook x"></i></div> <div class="wt"><i class="fa-solid fa-chess-knight x"></i></div> <div class="blk"><i class="fa-solid fa-chess-bishop x"></i></div> <div class="wt"><i class="fa-solid fa-chess-queen x"></i></div> <div class="blk"><i class="fa-solid fa-chess-king x"></i></div> <div class="wt"><i class="fa-solid fa-chess-bishop x"></i></div> <div class="blk"><i class="fa-solid fa-chess-knight x"></i></div> <div class="wt"><i class="fa-solid fa-chess-rook x"></i></div> </div> </div> </body> </html>
open in VScode