IMG css override not working anymore?

[Amalthia]

Hi, I've upgraded to 6.0 and this code no longer works? I've entered into the Look and Feel Extra CSS section.

img {text-align: center;}

[kovidgoyal]

What is your output format?

[Amalthia]

Originally Posted by kovidgoyal

What is your output format?

LRF is the output format. Input is HTML.

[kovidgoyal]

Hmm, it may have broken. Open a ticket and attach your HTML file.

[Amalthia]

Originally Posted by kovidgoyal

Hmm, it may have broken. Open a ticket and attach your HTML file.

I'll test it one more time at home because I remembered sometimes turning off the program and restarting it sometimes helps the settings work. But yes, if the problem persists I'll open a ticket. I ended up eventually just adding the <p align="center"> to the image file and that worked. But I'd like to move away from adding more code to the html file if possible.

[Jellby]

Originally Posted by Amalthia

Hi, I've upgraded to 6.0 and this code no longer works? I've entered into the Look and Feel Extra CSS section.

img {text-align: center;}

Is that supposed to work?

That would mean, AFAIK, that whatever inside the <img> will be centered in the <img>, but the <img> has no content, it is content itself, what you need is adding "text-align: center" to the parent element, <div>, <p> or whatever, so that the <img> is centered inside it.

Similarly, adding "text-align: center" to a <table> does not center the table on the page, but it centers the text inside the table cells.

[Amalthia]

Originally Posted by Jellby

Is that supposed to work?

That would mean, AFAIK, that whatever inside the <img> will be centered in the <img>, but the <img> has no content, it is content itself, what you need is adding "text-align: center" to the parent element, <div>, <p> or whatever, so that the <img> is centered inside it.

Similarly, adding "text-align: center" to a <table> does not center the table on the page, but it centers the text inside the table cells.

It worked in the past. I'd normally add this code to my html <p><img src=""></p>

and the css override would center the image. Not sure if it's supposed to work or not but it did before.

Still need to test this again.

I had some deadlines for converting this week so I was using 5.13 on my other computer.

[rogue_ronin]

Try this:

img {
display: block;
margin-left: auto;
margin-right: auto }

With this, you shouldn't have to put the images into paragraph tags.

m a r

[Amalthia]

Originally Posted by rogue_ronin

Try this:

img {
display: block;
margin-left: auto;
margin-right: auto }

With this, you shouldn't have to put the images into paragraph tags.

m a r

thanks! I'll try this out.

[pepak]

Originally Posted by rogue_ronin

Try this:

img {
display: block;
margin-left: auto;
margin-right: auto }

With this, you shouldn't have to put the images into paragraph tags.

That results in invalid (X)HTML, though - IMG is an inline element, it can't exist outside a block element. A standard-conforming reader should refuse to render it.

[rogue_ronin]

display: block;

Turns it into a block element.

m a r