How can I solve that when I click on a button it is translated to the right?
تبليغسؤال
يرجى شرح بإيجاز لمإذا تشعر أنك ينبغي الإبلاغ عن هذا السؤال.
Sorry for my bad English.
I have a button (access without login) in a form, problem, when I click on it, it is translated, on the right.
My code
.inviteBtn {
text-align: center;
padding: 20px 40px;
box-shadow: 0px 2px 6px -1px rgba(0, 0, 0, .13);
border: none;
outline: 0;
background-image: var(–gradient);
color: white;
border-radius: 15px;
cursor: pointer;
margin-left: 50%;
transform: translate(-50%, 0);
margin-right: -50px;
}
<form enctype=”multipart/form-data” method=”POST” class=”inviteForm”>
<button name=”invite” class=”inviteBtn”>Access without login</button>
</form>
text-align: center;
padding: 20px 40px;
box-shadow: 0px 2px 6px -1px rgba(0, 0, 0, .13);
border: none;
outline: 0;
background-image: var(–gradient);
color: white;
border-radius: 15px;
cursor: pointer;
margin-left: 50%;
transform: translate(-50%, 0);
margin-right: -50px;
}
<form enctype=”multipart/form-data” method=”POST” class=”inviteForm”>
<button name=”invite” class=”inviteBtn”>Access without login</button>
</form>
What it looks like:
I think it’s due to the translate but it serves to center the button.
Your help would be really appreciated! Thanks in advance!
أضف إجابة