code. compile. run. debug. share.
Source Code
Language
<!DOCTYPE html>
<html>
<head>
<link href="style.css" rel="stylesheet" />
</head>
<body>
<nav>
<a href="https://developer.mozilla.org/en-US/docs/Web/CSS/position">mdn documentation</a>
 
<a href="https://www.w3schools.com/howto/howto_js_navbar_sticky.asp">W3C documentation</a>
 
<a href="https://developer.mozilla.org/en-US/docs/Web/CSS/Reference#index">mdn CSS properties</a>
</nav>
<div id="grid">
<div id="c1">
<img src="https://picsum.photos/200/300" alt="sky" width="100%" />
</div>
<div id="c2">
<img src="https://picsum.photos/id/237/200/300" alt="sky" width="100%" />
</div>
<div id="c3">
<img src="https://picsum.photos/200/300?grayscale" alt="sky" width="100%" />
</div>
<div id="c4">
<img src="https://picsum.photos/200/300/?blur=2" alt="sky" width="100%" />
</div>
<div id="c5">
<img src="https://picsum.photos/id/870/200/300?grayscale&blur=2" alt="sky" width="100%" />
</div>
<div id="c6">
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcRE86EleqPhGhRxgBWmoEzQtlKokbVb1fbj7A&usqp=CAU" alt="sky" width="100%" />
</div>
<div id="c7">
<img src="https://picsum.photos/id/0/info" alt="sky" width="100%" />
</div>
<div id="c8">
<img src="https://picsum.photos/200/300" alt="sky" width="100%" />
</div>
<div id="c9">
<img src="https://encrypted-tbn0.gstatic.com/images?q=tbn:ANd9GcQhv5aKz0-ZeVY1-PW6tFdlc_heFH3FQZ2w3aPvx1JV2VtTn_NgSwFoYk0gImtv52PFFFo&usqp=CAU" alt="sky" width="100%" />
</div>
</div>
<script src="script.js"></script>
</body>
</html>
#c1 {
background-color: blue;
}
#c2 {
background-color: green;
}
#c3 {
background-color: red;
}
#c4 {
background-color: orange;
}
#c5 {
background-color: yellow;
}
#c6 {
background-color: purple;
}
#6:img {
height: 200px;
}
#c7 {
background-color: grey;
}
#c8 {
background-color: lightblue;
}
#c9 {
background-color: pink;
}
#grid {
display: grid;
grid-template-columns: 1fr 1fr 1fr;
grid: repeat(3, 500px) / auto-flow;
grid-auto-rows: minmax(30px, auto);
}
nav {
position: fixed;
top: 0px;
width: 100%;
background-color: yellow;
}
'use strict';
Compiling Program...
Standard Input:
Interactive Console
Text
Program is not being debugged. Click "Debug" button to start program in debug mode.
| # | Function | File:Line |
|---|
| Variable | Value |
|---|
| Register | Value |
|---|
| Expression | Value |
|---|
| # | Description |
|---|