Broken table layout if content is too large

[Artem Skoretskiy]

In ADmin - if content has too much width it doesn't fit into container and filter overlays it.

Please, look at screenshot and complete HTML attached

[Artem Skoretskiy]

Screenshot of broken filter block

[Artem Skoretskiy]

Complete code for error

[Julien Phalip]

I can't seem to be able to reproduce this. Could you provide some source code that we can test?

[Julien Phalip]

See a related issue in #9181.

[Julien Phalip]

Here's a test case:

# models.py:
from datetime import datetime
from django.db import models

class MyModel(models.Model):
    a = models.CharField(choices=(('draft', 'Draft'), ('published', 'Published')), default='draft', max_length=50)
    b = models.DateTimeField(default=datetime.now)
    c = models.DateTimeField(default=datetime.now)
    d = models.DateTimeField(default=datetime.now)
    e = models.DateTimeField(default=datetime.now)
    f = models.DateTimeField(default=datetime.now)
    g = models.DateTimeField(default=datetime.now)
    h = models.DateTimeField(default=datetime.now)
    i = models.DateTimeField(default=datetime.now)
    j = models.DateTimeField(default=datetime.now)

# admin.py:

from django.contrib import admin

from .models import MyModel

class MyModelAdmin(admin.ModelAdmin):
    list_display = ['a', 'b', 'c', 'd', 'e', 'f', 'g', 'h', 'i', 'j']
    list_filter = ['a']

admin.site.register(MyModel, MyModelAdmin)

Note that this is not a problem with the filter but with the results' table itself -- that is, the problem is present whether or not there is a filter. More specifically, the problem comes from the fact that certain types of data (time, date and FK) get a nowrap class, preventing the content of the cell to wrap and adapt to the available width space. See #11447, for example, to see the necessity for that non-wrapping.

I've attached one possible fix making a horizontal bar appear if the table's content can't fit in the page.

[loic84]

Closing in favor of patch in #19972.