jQuery ui slider moves the whole form table

Im having a trouble using my contact form generator .

When i use the jQuery slider, and if i move the slider to '0' the whole form moves a bit on the right. And if i move the slider to '100' the whole form moves a bit to left.

I use tables in order to keep the structure开发者_Python百科 of the form. Link to my form

You haven't accounted for the relative position of the container that shows the number of currency; as the decimals get bigger is pushes your content. either make it absolutely positioned or account for the maximum space is can occupy (give it a width that has space for 100).

You have to do that to the parent that determines the layout. in this case the th of the table. I strongly advice you to stop using tables as a tool for making layouts. you should use semantic tags that are made for creating layouts.

It's just a problem for the size of your label, you're putting a fixed width (width:20px) on your label, which is an inline element.

But you can't do that on inline elements so it's size change as the text change. If you put a div around, like that: <div style="width:40px">yourtext<label></label></div> the width won't change.

Edit: to get a better idea on the use of width with inline elements: CSS fixed width in a span