Problem/Motivation
The view content is set as display: grid due to changes from 3365367 in views.css which breaks views layout with pager. example on the screehshot.

Steps to reproduce:
- Standard Drupal 10.3.1 installation with Olivero as default theme
- Create multiple nodes (e.g., of type Basic page)
- Create a view of content (Basic page), it could be Page or Block (have not tried others)
- Set the pager to full pager and maintain the 'number of items per page', making sure you have more nodes than fit on one page
- The display Format style doesn't matter - it can be table or content output
- Look at the view output in Olivero with full pager and then with mini
- Add an exposed filter to the view display
- Add header with "Global: Text area (Global: Text area)" with random text to the view
- Look again at the view output in Olivero with full pager and then with mini
Proposed resolution
Remove display:grid and its related props from views.css
Remaining tasks
User interface changes
Before:

After:

| Comment | File | Size | Author |
|---|---|---|---|
| #21 | Screenshot 2024-12-27 232338.png | 54 KB | brookfield |
| #21 | Screenshot 2024-12-27 232643.png | 47.49 KB | brookfield |
| #19 | views-remove-grid-layout-Olivero-3465399-19.patch | 1.63 KB | krisahil |
| #18 | Screenshot 2024-08-21 223634.png | 132.21 KB | marc.bau |
| #13 | Test-Content.png | 55.31 KB | dishakatariya |
Issue fork drupal-3465399
Show commands
Start within a Git clone of the project using the version control instructions.
Or, if you do not have SSH keys set up on git.drupalcode.org:
- 3465399-views-incorrect-display
changes, plain diff MR !9173
Comments
Comment #2
ahsannazir commentedNot able to reproduce the issue at my end. Can you please add the detailed steps to reproduce the issue.
Comment #3
cilefen commentedComment #4
aschiwi commentedThe same problem brings me here.
To reproduce:
- Standard Drupal 10.3.1 installation with Olivero as default theme
- Create three nodes of type Basic page
- Create a view of content (Basic page), it could be Page or Block (have not tried others)
- Set the pager to full pager and show two items
- It doesn't matter if it's a table or content output
- I do not have a filter
- Look at the view output in Olivero with full pager and then with mini
I have attached screenshots:
- Output with mini pager
- Output with full pager
- My simple view configuration to reproduce
Comment #5
aschiwi commentedSetting status to Active and removing the issue tag because I think it can be reproduced with my info.
Comment #7
ahsannazir commentedRemoved the
display:gridstyles from.view, .view-content.Comment #8
manibharathi ezhimalai ravi commentedHi,
I've reviewed the MR !9173 on Drupal 10.3.
Testing Steps:
Test Results
Content are looking properly displaying inline in the mini pager and Full pager settings.
Comment #9
smustgrave commentedIssue summary is incomplete. Should follow standard template
Comment #10
ahsannazir commentedComment #11
ahsannazir commentedComment #12
dishakatariya commentedHi, I have verified this issue in the D11.x-dev version with latest MR applied cleanly and working as expected.
Testing Steps:
1. Standard Drupal 11.x-dev vesrion installation with Olivero as default theme
2. Create three or more nodes of type Basic page
3. Create a view of content (Basic page), it could be Page or Block (have not tried others)
4. Set the pager to full pager and show two items
5. It doesn't matter if it's a table or content output
6. Look at the view output in Olivero with full pager and then with mini
Testing Results:
Content are looking properly displaying inline in the Full pager settings with the two paged items.
Attaching the screenshots.
Keeping in the needs review for the detail review of the summary and code.
Comment #13
dishakatariya commentedComment #14
marc.bauYou patch helped a bit, but I see more issues - if full pager is shown. With mini pager the issues are not shown.
Tested with 10.3.2
Comment #15
smustgrave commentedPer #14
Comment #16
ahsannazir commented@marc.bau I have followed the steps mentioned in #14 but was not able to reproduce it.
Could you please add a screen capture to see what exactly looks broken
Comment #17
shweta__sharma commentedAs per #16 adding tag STR
Comment #18
marc.bauComment #19
krisahil commentedAttaching static patch from the state of the MR https://git.drupalcode.org/project/drupal/-/merge_requests/9173 today (at commit 3fe50913). (I prefer a static patch because, if you link directly to the patch endpoint on Gitlab (e.g., https://git.drupalcode.org/project/drupal/-/merge_requests/9173.patch), you might get newer commits that you don't want).
Comment #20
nikhil_110 commentedI am confused about whom to provide the steps to, as the steps have already been provided, and now that I have added the STR tag according to point #17, the process of conversion is confusing because the two Drupal profiles involved are different, and I am unsure how to proceed with the conversion due to these differences, so I would appreciate it if you could provide the correct details and further clarification on how to handle this situation appropriately.
Comment #21
brookfield commentedI'm uncertain if this is helpful because it repeats the finding of @marc.bau.


Drupal 10.4.0
Create view with header content, exposed filter, table, full pager.
After commenting line 15 of views.css in either Firefox or Edge
Comment #24
quietone commentedClosed #3464292: View mode displays list incorrectly after an upgrade to Drupal 10.3.x as a duplicate and adding credit
Comment #25
johnvComment #26
johnvThe following issues are duplicates, having competing solution proposals:
I cannot judge which solution proposal is best. I guess the second one.
Issue summary is now updated with better screenshots and steps to reproduce, so removing tags.
Comment #27
smustgrave commentedFixes should be in correct MR
Comment #28
catchMarking duplicate of #3466032: Olivero Full pager template creates additional grid columns
Comment #29
catchActually moving to duplicate now. Trying out the new 'assign credit on closed issues' rather than transferring over.