KokoaTalk Clone Coding: combinators
<head>
<style>
body {
height: 1000vh;
margin: 50px;
}
span {
background-color: yellowgreen;
padding: 5px;
border-radius: 10px;
}
p span { span inside of the p
color: white;
}
</style>
</head>
<body>
<div>
<span>Helen Keller says</span>
<p>
The world is full of suffering but it is also full of people
<span>overcoming</span> it.
</p>
</div>
</body>
add
div > span { this span is direct children of the div
text-decoration: underline;
}
<head>
<style>
body {
height: 1000vh;
margin: 50px;
}
span {
background-color: yellowgreen;
padding: 5px;
border-radius: 10px;
}
p + span { this span is next to the paragraph
text-decoration: underline;
}
p span {
color: white;
}
</style>
</head>
<body>
<div>
<p>
The world is full of suffering but it is also full of people
<span>overcoming</span> it.
</p>
<span>Helen Keller says</span>
</div>
</body>
