Need CSS for consistent input box positioning

Gravity Support Forums » Plugin Support » Gravity Forms

MangoMM
Member

My form is set up with label placement "left_aligned".

I have a list of products, which vary in price significantly. For example, one item may be £300.00 and another £3,000.00.

As you can see, £3,000.00 takes up much more space than £300.00

What my problem is that the price label also takes up space, which means that the input box for quantity is floated to the left of the pricing label at differing amounts each time.

This looks quite ugly.

http://s8.postimage.org/bnpbifqp1/Screen_shot_2012_09_05_at_09_45_05.png

I have attempted to change the css for .ginput_product_price to display block, and then setting a standard width, however this makes things look even worse.

http://s8.postimage.org/ral69jtut/Screen_shot_2012_09_05_at_09_45_32.png

Are you able to help me with the css to make this look consistent at all? I am surprised nobody else appears to have had a similar issue on these forums.

Posted 11 years ago on Wednesday September 5, 2012 | Permalink
Kevin Flahaut
Administrator

Adding the "display: block" property to your inputs is going to force them to a new line like you've discovered and it's not going to get you where you need to be. Screenshots are nice, but please post a URL to your form page and we can inspect your form and give you some specific guidance to help you out.

Most likely you can set a specific width for your label and that will work but without seeing your form, I can't tell you for sure.

Posted 11 years ago on Wednesday September 5, 2012 | Permalink
MangoMM
Member

Hi there,
Thanks for the reply.
http://goldealers.co.uk/precious-metals-calculator/?metal=Coins

Posted 11 years ago on Wednesday September 5, 2012 | Permalink
Rob Harrell
Member
Try dropping this into your theme's stylesheet:
```
[css]
.gform_wrapper span.ginput_product_price {
width: 100px;
display: inline-block;
}
```
Result
Posted 11 years ago on Wednesday September 5, 2012 | Permalink
Kevin Flahaut
Administrator

Rob is the man. That is all.

Posted 11 years ago on Wednesday September 5, 2012 | Permalink