Changing the margin size

HTML-CSS
1

I have the below code

input[type="submit"] {

  display: block;

  width: 60%;

  min-width:300px;

  margin: 1em;

  height: 2em;

  font-size: 1.1rem;

  background-color: #3b3b4f;

  border-color: white; 

}

I want to change the margin property to include 1em on the top and bottom. I want to use the existing margin property to include 1em on the top and bottom.

2

I’ve edited your post 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 (’).

You can use the margin-top and the margin-bottom separately,
Or u can use the margin property and set the top and bottom to 1em and the left and right to 0.

3

how do i implement the second option that you gave please

4

Using the margin property you can declare it using two values,
You might be knowng to declare margins using 4 values. Similarly you can declare the margin with two value, the first for the top and bottom values, the second for left and right values.

Example:

margin: top-bottom left-right /* This is the syntax */

/*Example*/
margin: 10px auto; /* This sets the top and bottom margin to 10px and the
left and right to auto */
5

Using just margin is the shorthand version. To understand it better I suggest you look over this page from MDN.

6

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