#4766 - Non-flow mode box alignment issue
| Identifier | #4766 |
|---|---|
| Issue type | Major issue (breaks an entire feature) |
| Title | Non-flow mode box alignment issue |
| Status | Completed |
| Handling member | Chris Graham |
| Version | 10.0.39 |
| Addon | galleries |
| Description | Have tried this layout on two different installs. After the 5th entry the boxes start aligning to the right and certain titles are not being trimmed to fit the box. Trying to find where the title comes from is also very challenging (maybe it's just me). |
| Steps to reproduce | |
| Funded? | No |
| Commits |
The system will post a comment when this issue is modified (e.g., status changes). To be notified of this, click "Enable comment notifications".


Comments
(Click to enlarge)
When some gallery media as ratings and some doesn't, the grid layout is thrown off.
Technical explanation:
There are two issues:
1) There is margin collapsing on the paragraph to the left, but not on the rating to the right. This makes the rating taller.
2) The stars are still slightly taller than the paragraph to the left in some situations.
gallery_media_title_cropped max-width set to 100px instead of the default 120px doesn't seem to have any effect. Using the theme tools "Show template edit links" has the entry displaying fine on the preview, so I have no idea why this entry is deformed.
(Click to enlarge)
I can't see any default styles on gallery_media_title_cropped, so I think you put the 100px on then the 120px on.
The issue you seem to be having is it's wrapping. Do this...
.gallery_media_title_cropped {
max-width: 120px;
white-space: nowrap;
overflow-x: hidden;
text-overflow: ellipsis;
}
This will force it onto one line with a max width, and add a "..." via CSS.
{$TRUNCATE_LEFT,{TITLE},23,0,0}
in GALLERY_VIDEO & GALLERY_IMAGE.tpl
to just {TITLE}
You need to change it to <span>{TITLE}</span>
Otherwise the ".gallery_media_title_cropped>span" CSS rule won't hit it. The TRUNCATE_LEFT is adding a span itself, so you need to put it back in manually.