Anchor Div Box to bottom instead of top of auto sized box

1

Hello,
I have portion of the template that is supposed to be upside down. Part of the requirement is for the box to auto size based on how many lines the variable is. When I rotate the box 180 degrees and the text is upside down, the box’s variable height still moves down instead of up. I’ve attached 2 pictures as and example. If an address was an example, on a non-rotated box, the box would expand down with the number of lines of address present. If I would rotate it 180 degrees, I’d expect it to expand up now instead of down.

Snap2 Snap1

I found the topic below, which has some solutions which I will try, but if it’s upside down, shouldn’t the rules flip as well?

Thanks for any advice here.

2

Hi TSled,
I’m able to reproduce the problem. I was able to work around it using CSS. Admittely not very elegant but it does the trick. Make sure the selector of this CSS rule matches the ID of your box.

#box {
	transform-origin: 0 0;
	transform: rotate(180deg) translateX(-100%) !important;
}

Erik

image
image1157×868 38.1 KB

3

Yes, that did the trick. Like you said, not elegant but works. If I change some paragraph formatting in the box, things can change unexpectedly but if the changes are set prior to assigning this CSS Code, it’s pretty good.
Thanks for the help!