Changing UI Panel size

Hello, i want to make a simple HP bars with uGUI.

I’m using 2 panels for hp bar: 1 indicates the whole bar (black one) and other one indicates remaining hp (red one).
I’m making something like PVP Fighting scene, so there’re 2 hp bars in the top of the screen.

When i lower players HP i change red bar size using:
transform.localscale(currentHp - damage);

In other words i want to make a standrt hp bars like in Mortal Combat.

My problem is in the screen:
http://screencast.com/t/xfIrMPUQCxrJ

Can you tell me how to make it in “proper” way?

well, my problem was in wrong Pivot point for the second hp bar.
Sorry for being annying.

You should be using a slider instead of a panel. It is perfect for health meters and you can tell it to go left to right or any direction