Ok, now the text each aligns different, any ideas?

.emotion-title {
    position: absolute;
    bottom: 8px;
    left:  44px;
    font-size: 32px;
    text-transform: uppercase;
    transform-origin: left bottom;
    transform: rotate(-90deg);
}

Has anyone told you, your beautiful! cause you are :D thank you so much :D

@Oot42

One issue when implementing to table the text shifts, anyway to fix this? When I try the non-table ones it is too far left.

Template and TemplateStyles (new location on live wiki instead of test).

I don't know why, but it's caused by the "wikitable" class.

If you remove that it works fine. It also works with "fandom-table" or "article-table". Or you have to design your own table.

Btw, "valign" is deprecated (and for some reason doesn't work with fandom-table).

I usually add a class "aligntop-table" to wikis, which is much more convenient than repeating it for every row.

/*  aligntop-table  -  top align all cells  */
.aligntop-table tr :is(td,th) { vertical-align:top; }

/edit:

It is caused by some of the wiki's custom css rules for "wikitable" defined in both Common and Fandomdesktop.css (of which some seem to be duplicated).

If you disable site css, it works as well:

https://sims.fandom.com/wiki/Emotion?usesitecss=0

/edit-2:

Your template's switch could be optimized like this:

User:Oot42/Sandbox-2?oldid=3870876

/edit-3:

It's caused by the line-height defined in Fandomdesktop.css:

Oh, awesome on all accounts! I'll work on this, this morning, ty!

I don't have access to the wikis site wide css but in the process of trying to get an overhaul for it I'll add that to the proposal.

Just to pick your brain one more time on this template, any idea why in mobile view half the text is hidden behind the image and half is not?

https://sims.fandom.com/wiki/Emotion

No idea.

Also, I never surf the web on mobile.

Btw, looks like you could fix the thing caused by the wikitable line-height setting by adding this to .emotion-title in the TemplateStyle:

line-height:2;

Ty!

I usually don't either but my last 2 templates I decided to be mindful on how they look in mobile, in case I get complaints LOL.

Is there a way to scale the text when the text gets too long? atm it just cuts off.