CODEWITHSUNDEEP
extjs
bartoleo
bartoleo

Reputation: 299

Problem Fieldset label not visible with Sencha ExtJs 7.x on chrome 87.0.4280.67

I have a problem with chrome 87.0.4280.67 and Sencha ExtJs 7.x, after chrome update Fieldset label are not visible.

I can see the problem in the official kitchensink examples: https://examples.sencha.com/extjs/7.2.0/examples/kitchensink/?classic#form-fieldcontaine

Upvotes: 10

Views: 1471

Answers (5)

Likhith
Likhith

Reputation: 46

I fixed it by adding the below code:

.x-fieldset-header, .x-fieldset-header-default .x-tool-tool-el {
    overflow: static;
}

Upvotes: 0

Kevin Cassidy
Kevin Cassidy

Reputation: 21

Seems like the only one which works well, and does not affect Safari is just a simple:

.x-fieldset {
    overflow: unset;
}

Upvotes: 0

mattiam
mattiam

Reputation: 76

According to Sencha Support, the best solution is:

.x-fieldset-header, .x-fieldset-header-default > .x-fieldset-header-text {
    position: initial;
}

.x-fieldset-header, .x-fieldset-header-default .x-tool-tool-el {
    overflow: initial;
}

I've tested it on Ext 7.3.1 and 6.5.3

Upvotes: 6

Bart
Bart

Reputation: 66

I fixed it with

.x-fieldset-header,
.x-fieldset-header .x-tool-tool-el {
    overflow: unset;
}

Using only the position technique in @Gasper's answer worked for fieldsets that had only labels, but with collapsible fieldsets the expand/collapse icon was still hidden.

Upvotes: 4

Gašper
Gašper

Reputation: 815

We fixed it by adding

position:static

or

position: unset // (thanks to mitchell)

to

.x-fieldset-header-default > .x-fieldset-header-text

I tested it in ExtJS 6.2.1 and 7.3.1 in Chrome, Firefox and Edge and it works at the moment.

Upvotes: 4

Related Questions