<!-- React-mount-point-unstable--> destroying my css

1
in css we often use selectors such as nth-child, or table+.mx-listview mendix is injecting a script, and css is counting this as an element which makes a lot of css selectors unusable. anyone know how to get rid of the script? Edit: added idea to the idea forum to solve this: https://forum.mendix.com/link/ideas/1882 Edit2: ”Hi Jason, We really appreciate that you took the time to share this with us. This is a platform behavior rather than a bug, but we understand it might be inconvenient for you, however, I can see that you already created an entry on the idea channel which is the correct way to address this. Every quarter all our customers can bring in feature requests, which can be enriched and voted on by others. Based on this feedback we determine which features have most value according to our customers and will be implemented. I will now set this ticket status as solved as there is no further action that the support team can take. As always, we are grateful for your feedback and thank you for your understanding and patience. Best regards, Sergio Randazzo Senior Technical Support Engineer”  
asked
6 answers
2

You could probably work using the :nth-of-type selector instead, unless the rest of the nodes is a mixed bag of elementtypes.

 

https://www.w3schools.com/cssref/sel_nth-of-type.asp

answered
1

i guess this works too… just not the best solution.

.ap_table-lined + .mx-listview, .ap_table-lined + script + .mx-listview{
  background-color: red;
}

 

answered
1

Yeah i saw the script also pop-up in some versions.

Never had an issue with it, but i can imagine someday i will, just like you…
That day has come!  makes it so ugly and unpredictable for the future!

For now i think your own suggested solution is the only solution.. Would use that one too.

Maybe Mendix can move the script all the way to the bottom of the element in a future release?

answered
1

I am using a one-size fits-all bit of code within my own flexbox usage.

> *:not(:empty):not(.nospacer) + *:not(:empty):not(.nospacer),
> script + *:not(:empty):not(.nospacer) {
  // stuff
}

 

answered
1

One solution that may work is to use the :last-of-type rather than last-child. Ofcourse this only works for when all your elements are similar types, such as a series of DIVs in a flex container which is messed up by the script elements

answered
0

I filled a bug/support ticket: “ your request(98876)”

answered