I'm having trouble getting custom CSS to do something very simple.

In the Modus theme, gallery comments are displayed centered in a space at the top of the gallery page. When those comments consist of several paragraphs, that looks really bad, and I wanted to make them left-aligned.

A few seconds with the DOM tools in my browser and it appears that the comment on that page is displayed in a div of class additional_info; so I added a tiny bit of custom CSS via editing in the local files plugin.

div.additional_info {
  text-align: left;
}

And saved it, and refreshed the gallery page.

The comment was still centered.

Digging into the  browser's interpretation of the code, what it reports for the div surrounding the comments is:

element {
}
.content .additional_info {
    font-size: 110%;
}
.content .navigationBar, .content .additional_info, .content .calendarBar {
    text-align: center;
}
div.additional_info {
    text-align: left;
}

That last bit, where my "text-align: left;" appeared, is grayed out.

But why is it grayed out? It's later in the combined CSS file as served by Piwigo, which ought to make it take precedence (the file position is given, but didn't copy over to here). It's where it was placed automatically, which I would expect to be right.

If I turn off the previous batch of settings in the browser tools, it does indeed align left. (Browser is current Firefox)


    Piwigo 11.5.0 Check for upgrade
    Operating system: Linux
    PHP: 7.4.20 (Show info) [2021-10-04 15:26:36]
    MySQL: 5.7.29-log [2021-10-04 15:26:36]
    Graphics Library: ImageMagick 6.9.7-4


Piwigo URL: https://fanpa.mnstf.org/piwigo/index.php?/category/355

(That's to a gallery with comments, which are showing centered)