Remember our cookie recipe?
<!DOCTYPE html>
<html lang="en">
<head>
<link rel="stylesheet" href="style.css">
<meta charset="utf-8">
<title>Pseudo-classes with Cookies</title>
</head>
<body>
<h1>Chocolate Chip Cookies Recipe</h1>
<ul>
<li>Whisk together <a href="https://en.wikipedia.org/wiki/Salt">salt</a> and butter.</li>
<li>Whisk the egg, vanilla and the <a href="https://en.wikipedia.org/wiki/Sugar">sugars</a></li>
<li>Sift in the flour and baking <a href="https://en.wikipedia.org/wiki/Sodium_carbonate">soda</a>.</li>
<li>Fold in the chocolate chunks, then chill the dough for at least 30 minutes.</li>
<li>Preheat oven to 350°F (180°C). Line a baking sheet with parchment paper.</li>
<li>Scoop the dough with an ice-cream scoop onto a parchment paper-lined baking sheet</li>
<li>Bake for 12-15 minutes, or until the edges have started to barely brown.</li>
<li>Cool completely before serving.</li>
<li>Enjoy!</li>
</ul>
</body>
</html>body {
text-align: justify;
margin-left: 25%;
margin-right: 25%;
width: 50%;
}
a:visited {
color: green;
}
li:nth-child(3n) {
border: solid;
}
h1:hover {
background-color: gold;
}
...What changes do we need to make in CSS so that all the list items get margin-left in 50px when the mouse hovers over them?
Please, write your answer entirely on the one line.