rosa.gr - side element overlaps with text

[back2themoon]

https://www.rosa.gr/koinonia/m-karystia ... -fili-tis/

(click the left button to reject cookies, if asked)

rosa.png

rosa console.png

Tried flipping both below, but noticed no difference.

dom.enable_performance_observer
dom.serviceWorkers.enabled

[adoxa]

I think the problem is due to the writing mode being vertical (writing-mode: vertical-rl), but the width is still being treated as if it was horizontal. Try adding this style: .title-column: {width: 50px}.

[back2themoon]

Thanks. Auto-converted it into a userscript as always, conversion was successful but the script doesn't work.

I then tried creating a userstyle from that line, but failed:

Expected identified for pseudo-class or pseudo-element but found ''. Ruleset ignored due to bad selector

[back2themoon]

Adding the following uBO filter, seems to solve it by cutting away the unimportant left title of that side element:

Code: Select all

www.rosa.gr##.popular-container > .title-column

rosa uBO.png

This below is the intended, correct result. Hopefully, you guys will find out what is going on.

rosa correct.png

[adoxa]

Typical, as usual when I don't test it I do it wrong, there should not have been a colon. Using this style:

Code: Select all

@-moz-document domain("www.rosa.gr") {
  .title-column {
    width: 50px
  }
}

I get the correct result (in Basilisk).

[back2themoon]

Thanks adoxa. Works great.