1

I am trying to make my input field bigger on my wtform field. I found this post that shows how to use form-control,

{{ form.email(class_="form-control") }} Add a css class to a field in wtform

And this bootstrap one on how to use input-lg,

input class="form-control input-lg" id="inputlg" type="text" http://www.w3schools.com/bootstrap/bootstrap_forms_sizing.asp

But they are not working together in my code. There is no error it just doesn't work. 

<form id="signinform" class="form form-horizontal" method="post"
          role="form" style="font-size:24px;”>
{{ form.hidden_tag() }}
{{ wtf.form_field(form.last_name, class_="form-control input-lg") }}
</form>

There is a few more form lines but they don't need to be included.

How can I make this work? What am I doing wrong? (I have bootstrap and everything already imported)

Thanks

Thomas
  • 177
  • 2
  • 12
  • if you have only one field then you can easily increase the field width, otherwise if you have more field , use a div and inside div use class "col-md-5" and "col-md-5 col-md-offset-2". see the bootstarp modal tutorial – SumanKalyan Aug 12 '16 at 08:19
  • I was able to actually just use some javascript and just it to be bigger, If you are having the same problem here is the code I used: $(document).ready(function (){ $("#XX input").addClass('input-lg'); }); XX= id of the form – Thomas Aug 12 '16 at 14:55

1 Answers1

1

You can change the CSS for the field. Name the field and then add the corresponding style to CSS.

imapotatoe123
  • 656
  • 1
  • 10
  • 21