Change the number of Songs rows?

[user24 312]

Hi all, is it possible, in CSS only, to change the number of Songs rows on the Artist detail pages?

Currently it's default set to 3 rows, but I would like to change it to potentially 6 rows, if possible, to fit in with some other changes I'm working on. Cheers!

[Happy2Play 9780]

14 hours ago, user24 said:

Hi all, is it possible, in CSS only, to change the number of Songs rows on the Artist detail pages?

Currently it's default set to 3 rows, but I would like to change it to potentially 6 rows, if possible, to fit in with some other changes I'm working on. Cheers!

Looks like you will have to play with the numbers but something like this.

div.view-item-item div.artistSongsItemsContainer {
    height: 350px;
}
@supports ((display: -webkit-flex) or (display:flex)) {
    @supports (color:var(--fake-var)) {
        .itemsContainer-sideFooters {
            max-height: 30em
        }
    }
}

Only downside is the extra spacing for artist with not many tracks.

[user24 312]

Thanks. That works well. I might go with 8 rows, as part of my larger project, not sure just yet...

Yeah, the downside is noticeable, but it only affects a handful of my Album Artists, so I can live with it!

I also have a (unrelated) follow-up question, so will post as a separate topic...

[Multiverse 8]

And how can I hide them completely?

[Happy2Play 9780]

1 hour ago, Multiverse said:

And how can I hide them completely?

Something like this

div.view-item-item .artistSongsSection {display: none;}

 

[user24 312]

This has been working fine for me to display 8 rows up until now, but with the update to 4.9.1.90 today, the rows have reverted back to 3 only.

Here is the current code I am using:

/* CHANGE THE NUMBER OF SONGS ROWS FROM 3 to 8 */
div.view-item-item div.artistSongsItemsContainer {
    height: 520px;
}
    @supports ((display: -webkit-flex) or (display:flex)) {
    @supports (color:var(--fake-var)) {
        .itemsContainer-sideFooters {
            max-height: 35em
        }
    }
}

I still get the required expanded height of the section as per example below:

Is there an easy way to get the 8 rows back?  Thanks in advance!

[Happy2Play 9780]

Luke made different element more !Important so you have to change code or add !important to height of custom css.

Edited November 11, 2025 by Happy2Play

[user24 312]

Adding !important has the expanded rows working again in my current setup. Thank you!