Can someone explain this to me, not understanding

HTML-CSS
1

This is the link to the lesson:

HTML:

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8">
    <title>Nutrition Label</title>
    <link href="https://fonts.googleapis.com/css?family=Open+Sans:400,700,800" rel="stylesheet">
    <link href="./styles.css" rel="stylesheet">
  </head>
  <body>
    <div class="label">
      <header>
        <h1 class="bold">Nutrition Facts</h1>
        <div class="divider"></div>
        <p>8 servings per container</p>
        <p class="bold">Serving size <span class="right">2/3 cup (55g)</span></p>
      </header>
      <div class="divider lg"></div>

    </div>
  </body>
</html>

CSS:


* {
  box-sizing: border-box;
}

html {
  font-size: 16px;
}

body {
  font-family: 'Open Sans', sans-serif;
}

.label {
  border: 2px solid black;
  width: 270px;
  margin: 20px auto;
  padding: 0 7px;
}

header h1 {
  text-align: center;
  margin: -4px 0;
  letter-spacing: 0.15px
}

p {
  margin: 0;
}

.divider {
  border-bottom: 1px solid #888989;
  margin: 2px 0;
}

.bold {
  font-weight: 800;
}

.right {
  float: right;
}

.lg {
  height: 10px;
}

.lg, .md {
  background-color: black;
  border: 0;
}

so the code is obviously correct, by how is it working with the .lg and .md selectors?
I’m just not defining any .lg class or .md class in the HTML so where is that coming from?

thanks for any explination!

2

For the challenge you provided it’s link above you need to add a div element with the class mentioned in the challenge under your .lg class div.
reply if you have further questions.

3

I wasn’t asking how to do the challenge. I already completed it and I already know how it works.

I was just confused as to WHY it was working because I didn’t have a class named .lg nor .md

4

nevermind. I’m being stupid. A space just means it has two classes assigned. HAHA

5

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.