Skip to content
Snippets Groups Projects
Commit a82ddb43 authored by Pareek Ravi's avatar Pareek Ravi
Browse files

Initial drawing of board

parent c1be0dfe
No related branches found
No related tags found
No related merge requests found
table.fullBoard {
/*border: 1px solid black;*/
}
table.smallBoard {
/*border: 5px solid blue;*/
background: gray;
}
tr.cell td{
/*border: 1px solid black;*/
}
.square{
width:50px;
height:50px;
}
.v{
border-left:1px solid #000;
border-right:1px solid #000;
}
.h{
border-top:1px solid #000;
border-bottom:1px solid #000;
}
.bigSquare{
width:150px;
height:150px;
}
.vert{
border-left:5px solid #000;
border-right:5px solid #000;
}
.hor{
border-top:5px solid #000;
border-bottom:5px solid #000;
}
\ No newline at end of file
<h1> Ultimate Tic-Tac-Toe</h1>
<head>
<link rel="stylesheet" type="text/css" href="format.css">
</head>
<br>
<br>
<table class="fullBoard">
<!-- row1 -->
<tr class="innerBoard">
<!-- col 1 -->
<td class="bigSquare">
<table class="smallBoard">
<tr class="cell">
<td class="square">Cell: A - 00</td>
<td class="square v">Cell: A - 01</td>
<td class="square">Cell: A - 02</td>
</tr>
<tr class="cell">
<td class="square h">Cell: A - 10</td>
<td class="square v h">Cell: A - 11</td>
<td class="square h">Cell: A - 12</td>
</tr>
<tr class="cell">
<td class="square">Cell: A - 20</td>
<td class="square v">Cell: A - 21</td>
<td class="square">Cell: A - 22</td>
</tr>
</table>
</td>
<!-- col 2 -->
<td class="bigSquare vert">
<table class="smallBoard">
<tr class="cell">
<td class="square">Cell: A - 00</td>
<td class="square v">Cell: A - 01</td>
<td class="square">Cell: A - 02</td>
</tr>
<tr class="cell">
<td class="square h">Cell: A - 10</td>
<td class="square v h">Cell: A - 11</td>
<td class="square h">Cell: A - 12</td>
</tr>
<tr class="cell">
<td class="square">Cell: A - 20</td>
<td class="square v">Cell: A - 21</td>
<td class="square">Cell: A - 22</td>
</tr>
</table>
</td>
<!-- col 3 -->
<td class="bigSquare">
<table class="smallBoard">
<tr class="cell">
<td class="square">Cell: A - 00</td>
<td class="square v">Cell: A - 01</td>
<td class="square">Cell: A - 02</td>
</tr>
<tr class="cell">
<td class="square h">Cell: A - 10</td>
<td class="square v h">Cell: A - 11</td>
<td class="square h">Cell: A - 12</td>
</tr>
<tr class="cell">
<td class="square">Cell: A - 20</td>
<td class="square v">Cell: A - 21</td>
<td class="square">Cell: A - 22</td>
</tr>
</table>
</td>
<!-- row 2 -->
</tr>
<tr class="innerBoard">
<!-- col 1 -->
<td class="bigSquare hor">
<table class="smallBoard">
<tr class="cell">
<td class="square">Cell: A - 00</td>
<td class="square v">Cell: A - 01</td>
<td class="square">Cell: A - 02</td>
</tr>
<tr class="cell">
<td class="square h">Cell: A - 10</td>
<td class="square v h">Cell: A - 11</td>
<td class="square h">Cell: A - 12</td>
</tr>
<tr class="cell">
<td class="square">Cell: A - 20</td>
<td class="square v">Cell: A - 21</td>
<td class="square">Cell: A - 22</td>
</tr>
</table>
</td>
<!-- col 2 -->
<td class="bigSquare vert hor">
<table class="smallBoard">
<tr class="cell">
<td class="square">Cell: A - 00</td>
<td class="square v">Cell: A - 01</td>
<td class="square">Cell: A - 02</td>
</tr>
<tr class="cell">
<td class="square h">Cell: A - 10</td>
<td class="square v h">Cell: A - 11</td>
<td class="square h">Cell: A - 12</td>
</tr>
<tr class="cell">
<td class="square">Cell: A - 20</td>
<td class="square v">Cell: A - 21</td>
<td class="square">Cell: A - 22</td>
</tr>
</table>
</td>
<!-- col 3 -->
<td class="bigSquare hor">
<table class="smallBoard">
<tr class="cell">
<td class="square">Cell: A - 00</td>
<td class="square v">Cell: A - 01</td>
<td class="square">Cell: A - 02</td>
</tr>
<tr class="cell">
<td class="square h">Cell: A - 10</td>
<td class="square v h">Cell: A - 11</td>
<td class="square h">Cell: A - 12</td>
</tr>
<tr class="cell">
<td class="square">Cell: A - 20</td>
<td class="square v">Cell: A - 21</td>
<td class="square">Cell: A - 22</td>
</tr>
</table>
</td>
</tr>
<!-- row 3 -->
<tr class="innerBoard">
<!-- col 1 -->
<td class="bigSquare">
<table class="smallBoard">
<tr class="cell">
<td class="square">Cell: A - 00</td>
<td class="square v">Cell: A - 01</td>
<td class="square">Cell: A - 02</td>
</tr>
<tr class="cell">
<td class="square h">Cell: A - 10</td>
<td class="square v h">Cell: A - 11</td>
<td class="square h">Cell: A - 12</td>
</tr>
<tr class="cell">
<td class="square">Cell: A - 20</td>
<td class="square v">Cell: A - 21</td>
<td class="square">Cell: A - 22</td>
</tr>
</table>
</td>
<!-- col 2 -->
<td class="bigSquare vert">
<table class="smallBoard">
<tr class="cell">
<td class="square">Cell: A - 00</td>
<td class="square v">Cell: A - 01</td>
<td class="square">Cell: A - 02</td>
</tr>
<tr class="cell">
<td class="square h">Cell: A - 10</td>
<td class="square v h">Cell: A - 11</td>
<td class="square h">Cell: A - 12</td>
</tr>
<tr class="cell">
<td class="square">Cell: A - 20</td>
<td class="square v">Cell: A - 21</td>
<td class="square">Cell: A - 22</td>
</tr>
</table>
</td>
<!-- col 3 -->
<td class="bigSquare">
<table class="smallBoard">
<tr class="cell">
<td class="square">Cell: A - 00</td>
<td class="square v">Cell: A - 01</td>
<td class="square">Cell: A - 02</td>
</tr>
<tr class="cell">
<td class="square h">Cell: A - 10</td>
<td class="square v h">Cell: A - 11</td>
<td class="square h">Cell: A - 12</td>
</tr>
<tr class="cell">
<td class="square">Cell: A - 20</td>
<td class="square v">Cell: A - 21</td>
<td class="square">Cell: A - 22</td>
</tr>
</table>
</td>
</tr>
</table>
\ No newline at end of file
0% Loading or .
You are about to add 0 people to the discussion. Proceed with caution.
Finish editing this message first!
Please register or to comment