Display from left to right instead of up to down

Without seeing your page, here’s a quick and dirty example that I think does what you are asking. Note I added !important in the CSS. Not ideal but since I don’t know how your site is set up, it’ll work for an example.

[mctagmap columns="1"]

<style>#mcTagMap .tagindex, #sc_mcTagMap .tagindex { display: flex; }#mcTagMap .tagindex h4, #sc_mcTagMap .tagindex h4 { border-bottom: none !important; padding:0 12px 4px 0 !important; } #mcTagMap .tagindex h4:after, #sc_mcTagMap .tagindex h4:after { content:":";} #mcTagMap .tagindex ul, #sc_mcTagMap .tagindex ul { display: flex; flex-wrap: wrap; white-space: nowrap; } #mcTagMap .tagindex ul li, #sc_mcTagMap .tagindex ul li { padding: 2px 10px 2px 0 !important;}</style>

see: https://mctagmap.tugbucket.net/flex-inline-display/

Thx, that was what I was referring to.

Now I’m basically just showing the featured image and the title, but now it the title directly after the featured image, is it possible to have it centered over the image? (Preferable)

Or below?

(I couldn’t give you an address since the “maintenance page”would have intercepted you..

• This reply was modified 4 years, 8 months ago by Jellico.
• This reply was modified 4 years, 8 months ago by Jellico. Reason: Missed half of the massage

https://mctagmap.tugbucket.net/flex-inline-display-w-thumbnail/

See if that’s what you are looking for. Obviously there a ton with out images but you should get the idea. Go to the V section and you’ll see it centered.

Notice in the CSS flex-flow: column-reverse;, that will put the image under the text. flex-flow: column; will pu tit above the image.

https://css-tricks.com/snippets/css/a-guide-to-flexbox/

The column/reverse didn’t change anything, however a new strange issue has occurred.

I’ve been testing and modifying the css, but not the first part you gave me, that has been unchanged by me…
However, I thought it looked odd today, but I discovered that every time I press save, a lot of \\\ are added to the code.
This is how it looks now (without me changing anything): (conditional css, but it should say additional css?)

<style>#mcTagMap .tagindex, #sc_mcTagMap .tagindex { display: flex; }#mcTagMap .tagindex h4, #sc_mcTagMap .tagindex h4 { border-bottom: none !important; padding:0 12px 4px 0 !important; } #mcTagMap .tagindex h4:after, #sc_mcTagMap .tagindex h4:after { content:\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\":\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\";} #mcTagMap .tagindex ul, #sc_mcTagMap .tagindex ul { display: flex; flex-wrap: wrap; white-space: nowrap; } #mcTagMap .tagindex ul li, #sc_mcTagMap .tagindex ul li { padding: 2px 10px 2px 0 !important;}

</style>

This is how it’s supposed to be:
{ content:":";}
This is after I pressed save the first time: { content:\":\";}
This is after I pressed save twice:
{ content:\\\":\\\";}
This is after I pressed save the third time
{ content:\\\\\\\":\\\\\\\";}

• This reply was modified 4 years, 8 months ago by Jellico. Reason: Added more information
• This reply was modified 4 years, 8 months ago by Yui.

When I wrote:

The column/reverse didn’t change anything

I was referring to changing the location of the text, it’s under the image regardless column; or column-reverse;

The backslashes is because the “conditional CSS” textarea is just that, a textarea and WP is escaping quotes. You need to copy and paste the entire CSS block from my second link (https://mctagmap.tugbucket.net/flex-inline-display-w-thumbnail/) into an actual CSS file to prevent that.

The “Conditional CSS ” is just that, conditional CSS: “You will need to provide the conditional comment and all style tags.”

Don’t use the option page if you are using content: “” add the CSS to your theme’s CSS or another file.

Can you set up some test page for me to see?

Oh, I see..
Well, I can add the code directly in the css.
I can’t setup a test page since the maintenance page will stop you unless you’re from my IP.

I can however show a screenshot of my test with the new code in place, I think it will work great.
I might call for your help later, you never know..
See screenshot