CSS not respect position function

Third party integrations Floorplan
1

Hi,

I try to reposition a block using css but it doesn’t seem to respect the position function. Block-size works but position not, what Im doing wrong?

.garage-closed {
position: absolute;
bottom: 250px;
block-size: 500px;
fill: #FF4500 !important;
}

Thx
Mika

2

You might have to try a dedicated css forum…. Not sure how many people with those skills frequent here…

3

I found a solution to this as I needed it myself. Position doesn’t work for the SVG elements, use “matrix” as this is what’s used inside the SVG.

This does size and position at once.

/*  matrix(scaleX(), skewY(), skewX(), scaleY(), translateX(), translateY()) */
.thermostat_middle{
  display: inline !important;
  transform: matrix(2, 0, 0, 2, 100, 300);
  }
4

FYI I’ve had problems with setting text on elements that have a transformation applied but YMMV

5

that’s interesting because most elements in the svg have some sort of transform already applied, you’re just editing it.

I will try it to see if I have the same result as you.

1 Like