nayen — 2014-04-03T03:31:52-04:00 — #1
I am trying to align a checkbox to a button vertically and I tried using margin but it doesn't work.
Here is my code:
<input type="checkbox" style="margin-top: 2px" /> <button type="button" style="cursor: pointer; width: 80px; padding: 2px 0 3.5px 0; font-size: 13px">Button</button>
I am basically trying to move the checkbox about 2px down.
Thanks for any help.
nayen — 2014-04-03T04:39:03-04:00 — #2
EDIT: I guess I should have used the word "horizontally". I was thinking about how "vertical-align" property works.
ralphm — 2014-04-03T05:41:22-04:00 — #3
You might end up chasing your tail a bit on this. Some browsers align these vertically by default, so if you start to add margins for the sake of one browser, others might get thrown off. Is there a particular browser this is not working in?
nayen — 2014-04-03T05:47:00-04:00 — #4
In Firefox and Chrome, it is not aligned and it is above the middle horizontal line of the button by the same amount. So, moving it down like 2px is what I want to accomplish. In my code, the top margin has no effect on the checkbox and I don't know why.
EDIT: When I add "float: left" to the checkbox, the margin worked. I still don't know why it doesn't work without the float.