I am struggling to align 2 DIVs horizontally with CSS in my [Website], basically the Log in DIV is a bit higher than the Register DIV[1] [![Problem with 2 DIVs][2]][2]
CSS where I need help:
.woocommerce-form.woocommerce-form-login.login {
width: 50%;
float: left;
}
.woocommerce form.register {
border: 1px solid #d3ced2;
padding: 20px;
margin: 2em 0;
text-align: left;
border-radius: 5px;
width: 50%;
float: right;
}
What am I missing here?
Thank you for your help!
[1]: https://localchain.co.uk/my-account/
[2]: https://i.stack.imgur.com/ReVr6.jpg
2
Answers
I suspect that it is because of
margin
property which you only have atregister
div.If you remove that, both will be at the same starting distance.
With below CSS settings, the login and register section will be aligned.