Contact Form 7 - Multiple text fields on the same line

Question

I am using Contact Form 7 to design a booking form for a hotel.

http://istanabalian.com/book/

I can't figure out how to customize the layout. I'd like some of the text fields to be displayed on the same line but I don't find the correct identification for the elements and/or which CSS styling to use to achieve this very simple goal.

Here is the code :

I want to display the p elements of the form-row elements on a single line. I have tried this CSS line :

.form_row p{
display: inline-block
}

But it does not do anything. I feel I am missing something, can anybody help ?

Many thanks in advance,

Benjamin

Answer 1

You probably have a CSS rule that makes the <p> element full-width.

Why not use <div> and use the theme's classes?

<div class="form-row">
   <div class="grid-33">Number of adults [text your-adults]</div>
   <div class="grid-33">Number of children under 6 years old [text your-little-children]</div >
   <div class="grid-33">Number of children under 12 years old [text your-big-children]</div>
</div>