#test { color: aliceblue; } body { background: yellow; } div#box { width: 500px; height: 500px; color: aliceblue; background: rgba(0, 0, 0, 0.5); position: absolute; top: 200px; left: 200px; z-index: 2; /* text-decoration: underline; */ } #box:focus { border: 1px solid aqua; } #box2 { color: blanchedalmond; font-size: 100px; } /* #box2:hover { width: 200px; height: 200px; } */ div#test>h1 { font-size: 100px; background-color: aqua; padding: 50px; } div#text { background-color: blueviolet; } html { background-color: red; } .a { /* background-color: orange; */ background-color: orange; line-height: 100px; border: 20px outset aqua; border-left: 10px outset blue; border-right: 10px outset green; border-bottom: 20px outset purple; border-radius: 50px; text-decoration: underline; text-align: center; cursor: pointer; /* padding: 20px; */ } .a:focus { background: red; } .a:hover { background: purple; } #cont { position: relative; } #inset { position: absolute; top: 10px; right: 100px; width: 100px; height: 100px; background-color: azure; } #inset:hover { width: 50px; height: 50px; } #row { height: 50px; display: inline; } #row>span { width: 50px; height: 50px; background: pink; } #paragraph::before { content: "HI"; } .border { border-top: solid 20px blue; border-bottom: solid 20px orange; border-radius: 200px; border-left: 61px solid #0f0; border-right: 50px solid #000; }