CODEWITHSUNDEEP
djangodjango-admin
Walucas
Walucas

Reputation: 2568

Change django admin label position

I need to change how the default admin form is rendered.

It shows the label on the left like the image below. enter image description here

But I want it to be displayed on top of the input field, any idea?

Here is my admin.py

class ApplicationAdmin(admin.ModelAdmin):
    form = ApplicationAdminForm
    list_display = ['last_name', 'income']

    fieldsets=(        
        ("",{"fields": 
        ( 
            ('last_name',), ('income',),
),
            }
            ), 
        )

Upvotes: 0

Views: 1327

Answers (1)

tim-mccurrach
tim-mccurrach

Reputation: 6815

If we inspect the admin page, we can see it is the property float:left that is causing the labels to go the left as they do.

We can actually define custom classes for each fieldset in your admin, and you can include custom css files for each admin page. The following adds the class stack_labels to your fieldset, and adds a file called custom_admin_css.css (stored in your static directory) into the head of your admin page. 

class ApplicationAdmin(admin.ModelAdmin):
    class Media:
        css = {
        'all': ('static/your_app/custom_admin_css.css',),
    }

    form = ApplicationAdminForm
    list_display = ['last_name', 'income']

    fieldsets=(        
        ("",{
            "fields": ( 
                ('last_name',), ('income',),
            ),
            "classes": ("stack_labels",)
        }
        ), 
    )

So now, all we need to do is write some CSS:

.stack_labels label {
    float:initial;
}

This will fix things for you :)

Upvotes: 1

Related Questions