Question

When a user focus a text field, I want the border, which is 1px, to be 2px, so In order to avoid the GUI feel jumpy, I set:

 margin-bottom:-2px; 

This plays nice in Firefox but not in Chrome, is this a bug? any solution to have this working in Chrome?

Problem I get is sometimes when I deselect the text field the border sort of stays. This is an example image:

Answer 1

You should use the outline instead of the border as that does not affect positioning and surrounding objects.

To quote quirksmode.org:

The outline of a box is almost the
same as the border.

The outline is not actually a part of
the box, it does not count in any way
towards the width or height of a box.