I've spent the last two days trying to do this, and I can't figure it out. I'm using grappelli, and I've tried several things.
I tried specifying the widget:
class MyForm(ModelForm):
class Meta:
model = MyModel
widgets = {
'foreign_key': widgets.TextInput(attrs={'width': '200'}),
}
In this case, it just seemed to be ignored.
I also tried adding css using a Media
definition. This got loaded, but inspecting the element in my browse showed that it was overridden by the grappelli css.
Is there an easy way of doing this that I've missed?
I would re-try adding css using the media definition but this time, put a !important
to your css attribute.
.widget input {
width: 200px !important;
}
From http://en.wikibooks.org/wiki/Cascading_Style_Sheets/Important
The important keyword makes a declaration take precedence over normal declarations—those that are not tagged with the important keyword. So "p { color: red ! important }" takes precedence over "p { color: green }".