Learn Accessibility by Building a Quiz - Step 34

The program is asking me to: " To prevent unnecessary repetition, target the before pseudo-element of the p element, and give it a content property of "Question #"."

I understand that the problem comes from the “Question #”. However, I’m unable to correct the situation.

Here is my code so far:

p::before {
content:“Question #”;
}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/108.0.0.0 Safari/537.36

Challenge: Learn Accessibility by Building a Quiz - Step 34

Link to the challenge:

This passes for me. Perhaps you accidentally changed something else in the CSS file? It’s always best if you paste the entire code in here so we can see everything and help you find errors where you may not expect them.

To display your code in here you need to wrap it in triple back ticks. On a line by itself type three back ticks. Then on the first line below the three back ticks paste in your code. Then below your code on a new line type three more back ticks. The back tick on my keyboard is in the upper left just above the Tab key and below the Esc key. You may also be able to use Ctrl+e to automatically give you the triple back ticks while you are typing in the this editor and the cursor is on a line by itself. Alternatively, with the cursor on a line by itself, you can use the </> button above the editor to add the triple back ticks.

And if you use the “Ask for help” feature (which it appears you did) then your code will automatically be included in your post. But it looks like you may have removed that.

Thank you for your answer! I don’t think I erased anything by mistake, but here is my full CSS file.

  background: #f5f6f7;
  color: #1b1b32;
  font-family: Helvetica;
  margin: 0;
}

header {
  width: 100%;
  height: 50px;
  background-color: #1b1b32;
  display: flex;
}

#logo {
  width: max(100px, 18vw);
  background-color: #0a0a23;
  aspect-ratio: 35 / 4;
  padding: 0.4rem;
}

h1 {
  color: #f1be32;
  font-size: min(5vw, 1.2em);
}

nav {
  width: 50%;
  max-width: 300px;
  height: 50px;
}

nav > ul {
  display: flex;
  justify-content: space-evenly;
}

h1,
h2 {
  font-family: Verdana, Tahoma;
}

h2 {
  border-bottom: 4px solid #dfdfe2;
p::before {
  content: "Question #";
}
.sr-only {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

here’s the mistake

you erased the } of the previous rule

Thank you so much :slight_smile:

1 Like