previous

page 5

next
index.html
<html>
<head>
<title>Jigsaw</title>
<link rel='stylesheet' href='styles.css'>
<script src='library.js'></script>
<script src='pieces.js'></script>
</head>
<body>
<div id='grid'>
<script>pieces();</script>
</div>
</body>
</html>
styles.css
#grid {
display:grid;
width:200px;
height:200px;
grid-template-rows: repeat(2,100px);
grid-template-columns: repeat(2,100px);
}
.piece {
grid-row: 1/ span 1;
grid-column: 1/ span 1;
width:100%;
height:100%;
}

On the next page, we'll scramble the pieces so fetch my library from Project 4 so we have the Shuffle function.

previous
next