HTML/CSS Registration Form Course; Step 41

HTML-CSS
1

Tell us what’s happening:
Code Gets an Error. Have no idea what a pseudo-class is. W3 doesn’t help.

Your code so far

WARNING

The challenge seed code and/or your solution exceeded the maximum length we can port over from the challenge.

You will need to take an additional step here so the code you wrote presents in an easy to read format.

Please copy/paste all the editor code showing in the challenge from where you just linked.

Replace these two sentences with your copied code.
Please leave the ``` line above and the ``` line below,
because they allow your code to properly format in the post.

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:100.0) Gecko/20100101 Firefox/100.0

Challenge: Step 41

Link to the challenge:

2

Looks like it didn’t paste your code, but…

A pseudo-class is a keyword added to a selector to specify either a subset or special case for your selection. For example…

a { } would select and style all a elements on your page…

a:hover { } would select and style all a elements only when the mouse is hovering over it. :hover is a pseudo-class.

Pseudo classes can also be used to select subsets of your object… like a {} selects all a elements, but if you use the following pseudo class, a:first-of-type { }, it would only style the first a element on the page.

Does that help?

3

Thank you for the reply and the suggestion:

The instructions on Step-41 want the user to select all but the last fieldset element, and give them a border-bottom of 3px solid #3b3b4f.

The ‘hint’ error message suggests: :not(:last-of-type)

My code right now has:

:not(:last-of-type) {
border-bottom: 3px solid #3b3b4f;
}

4

Pseudo classes are meant to supplement a selector…

a:hover { }

header:first-of-type { }

etc… is yours missing something?

5

Thank you for the reply again.

The short answer to the question is:
Haven’t the foggiest.

The longer answer is:
Many of the course-exercises are excellent at introducing and explaining topics and showing code-samples.

The instructions for Step-41 do not have examples or explanations until the error message ‘hint’.

6

So you want to select some fieldset objects, right??? So you put fieldset, then if you want to add pseudo classes, you add those with a : .

7

If you’re still really stuck, frustrated, and confused, click the below at your own risk:

Helpful Solution

The below would select all fieldset objects that are not (last of its type)… therefore would select all but the last fieldset on your page, and will add a border to the bottom of it.

fieldset:not(:last-of-type) {
  border-bottom: 3px solid #3b3b4f;
}

:last-of-type selects the last object, but putting :not in front means you want all of them except the last one.

8

Solution to Step-41:

fieldset:not(:last-of-type) {
border-bottom: 3px solid #3b3b4f;
}

The above code works.

User Suggestion: Step-41 needs a better example.

If 3rd parties read these … especially payroll and general management… kinome79 needs a bonus, pizza, t-shirt and a raise for spending time on this.

Thank you again,

Martin Smith

1 Like
9

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