I have put my form on a page which uses columns (which I want), causing the text boxes go off the page: http://imgur.com/ImpO1jz
How do I decrease the size of the textboxes so they fit nicely within the page?
The code for my whole form is as follows:
<div style="margin: 0 auto; width:750px">
<p><b>Your Name:</b><br />
[text* your-name] </p>
<p><b>Contact Email:</b><br />
[email* your-email] </p>
<p style="text-align: left;"><b>Beds (Private): </b>[select* menu-969 "0" "1" "2" "3" "4"] <b>Beds (Dorm): </b>[select* menu-69 "0" "1" "2"] </p>
<p style="text-align: left;"><b>Check In:</b><br />
[date date-52] </p>
<p style="text-align: left;"><b>Check Out:</b><br />
[date date-753] </p>
<p style="text-align: left;">[submit "Request Booking"]</p>
</div>
For the textbox 'your name', for example, I tried adding 'size:30' to it like it said in the tutorial, so it looked like this:
<p><b>Your Name:</b><br />
[text* your-name size:30] </p>
But nothing happened.
Looking for some advice. Thanks