user944513
user944513

Reputation: 12729

why margin-top not working in percentage?

I am trying o give some margin to form from top in percentage (%).why it is not taking this property .I want to to give some margin to form from top.

here is my code http://plnkr.co/edit/byQLFlLh4a2qaIEZgfJH?p=preview

I am giving like that

.login-form {
  margin-top: 40%;
  width: 50%;
  margin: auto; }

It is not taking this margin-top: 40%; why ?

Upvotes: 0

Views: 125

Answers (3)

Leo the lion
Leo the lion

Reputation: 3065

Well this should be comment but after giving margin:top you are giving margin:auto which is overriding the last one. So better you should use margin:top after the margin:auto and Use !important in only last case as it's not good practise.

check here http://plnkr.co/edit/d6Xku9eFPP1L6anS6PVy?p=preview

Upvotes: 2

Waqar Haider
Waqar Haider

Reputation: 971

.login-form {
  margin: auto;
  margin-top: 40%;
  width: 50%; }

first put the auto than margin-top:40%;

Upvotes: 0

T.J. Crowder
T.J. Crowder

Reputation: 1074198

Just move the margin: auto above the margin-top: 40% so that the latter overrides the part of the former it relates to:

.login-form {
  margin: auto;
  margin-top: 40%;
  width: 50%;
}

Upvotes: 2

Related Questions