Learn HTML Forms by Building a Registration Form - Step 60

Tell us what’s happening:
I need to :
Change the margin property to include 1em on the top and bottom, while leaving the right and left margins set to auto . Then set the width as described above.

How did I do wrong with my code?

thanks a million

Your code so far

input[type="submit"] {
  display: block;
  width: 60%;
  left-margin: auto;
  right-margin: auto;
  top-margin: 1em;
  bottom-margin: 1em;
  height: 2em;
  font-size: 1.1rem;
  background-color: #3b3b4f;
  border-color: white;
  min-width: 300px;
}

Challenge: Learn HTML Forms by Building a Registration Form - Step 60

Link to the challenge:

I’ve edited your code for readability. When you enter a code block into a forum post, please precede it with a separate line of three backticks and follow it with a separate line of three backticks to make it easier to read.

You can also use the “preformatted text” tool in the editor (</>) to add backticks around text.

See this post to find the backtick on your keyboard.
Note: Backticks (`) are not single quotes (').

:sweat_smile: Thanks. I did not know those three backticks for.

it should be like this

Mod Edit: SOLUTION REMOVED

Yeah… it did pass. Thanks! But why is that?

Why do we not have to state which margin should be 1em and which margin should be auto?

It is great that you solved the challenge, but instead of posting your full working solution, it is best to stay focused on answering the original poster’s question(s) and help guide them with hints and suggestions to solve their own issues with the challenge.

We are trying to cut back on the number of spoiler solutions found on the forum and instead focus on helping other campers with their questions and definitely not posting full working solutions.

You do, but in this challenge you are using the “shorthand” for it. Here is some stuff copied from the article CSS Margin

Margin - Shorthand Property

To shorten the code, it is possible to specify all the margin properties in one property.

"The margin property is a shorthand property for the following individual margin properties:

  • margin-top
  • margin-right
  • margin-bottom
  • margin-left

So, here is how it works:

If the margin property has four values:

  • margin: 25px 50px 75px 100px;
    • top margin is 25px
    • right margin is 50px
    • bottom margin is 75px
    • left margin is 100px"

" If the margin property has two values:

  • margin: 25px 50px;
    • top and bottom margins are 25px
    • right and left margins are 50px"

So when you use margin: 1em auto you are saying the top and bottom are 1em, and right and left are auto

2 Likes

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