transform - Is it possible to "snap to pixel" after a CSS translate? -

i created modal box , vertically centred using technique chris coyer mentioned. problem i've found far box offset half pixel, can make of children little wonky. question is,: possible snap result nearest whole pixel?

update

here couple of pictures better illustrate issue. in first image, can see text inputs , link underlines have rendered correctly:

the second image shows effect after css transforms have been used. notice blur of link underline , incorrectly rendered text inputs.

although second image doesn't show it, notice top , bottom white lines wit same blurred effect.

for record, text inputs styled using simple borders , background colour. i've included css inputs here can see there's nothing special happening:

input {     background-color: #ffffff;     border: 1px solid #cccccc;     border-radius: 0;     box-shadow: 0 1px 3px -1px #d5d5d5 inset;     color: #4c4c4c;     display: inline-block;     font-family: arial,helvetica,sans-serif;     font-size: 12px;     max-width: 100%;     padding: 5px;     transition: border-color 0.1s ease 0s; } 

the bulletproof solution ensure element occupies even number of pixels. if height (or width) not divisible 2, attempt render element on half-pixel, causing blurriness.

firefox doesn't have issue because supports true subpixel rendering. so, though element on half-pixel, firefox handles elegantly.

in experience, webkit typically snaps elements nearest pixel –– (for instance, when using letter-spacing property) -- it's kinda strange doesn't behave same way translate.