CODEWITHSUNDEEP
css
Ray Yun
Ray Yun

Reputation: 1571

Css Relative Positioning with negative top percentage

Recently I'm playing with custom jquery ui widget which is positioned "center bottom" of specified position. (Just imagine that google map marker's anchor..)

First, I have main widget and a DIV which has relative positioning with left -50%. Yes, it was shifted to left by its half width. But for height, it's not working what I thought.

Please checkout my example at http://jsfiddle.net/Reiot/UUADc/ and see what's wrong with that. Should I not use vertical negative % and always specify its pixel height?

Upvotes: 3

Views: 9410

Answers (1)

Chris Curtis
Chris Curtis

Reputation: 1478

-50% is going to be 50% of the height of a parent object, in this case 200px. So your vertical is getting offset 100px. Since you know the width of your widget (73px), just use the specific offset, -36px

Upvotes: 3

Related Questions