All geek questions in one place

Can someone tell me why my background image in Sencha Touch 2 is not displayed?

Here is my MainView:

Ext.define("Test.view.Main", { extend: 'Ext.Panel', config: { cls: 'transp' } });

Here is the (relevant part) of my app.css:

 /* line 3, ../themes/stylesheets/sencha-touch/default/core/_reset.scss */ body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, code, form, fieldset, legend, input, textarea, p, blockquote, th, td { margin: 0; padding: 0; } .transp { background-image: url(http://support.sencha.com/assets/images/logo-sencha.png); background-repeat: no-repeat; background-size: 100% 100%; }

I know that it recognizes the class, because when I set the opacity to 0, the gray background of the main view is not displayed. Can someone please help me? I am in total loss.

+1
source share
3 answers

Try using !important in the CSS property.

+2
source

FWIW, this did not work for me.

I have a form panel with Sencha Touch and she had to do this: .TxPanel.x-scroll-container {background: url ('img / txbackground.png') re-center; }

after adding TxPanel to the cls setting for the form.

0
source

Once the point is working with CSS, which most people don’t understand, is specific! http://coding.smashingmagazine.com/2007/07/27/css-specificity-things-you-should-know/

So, if you have a background class .myBackground {background-image: ..} vs sencha.x-container.x-component.x-background {background-image: ..} The sencha class has more selectors and higher specificity and will override your .myBackground class! Even if it is announced after sencha css!

In any case, having learned about the specificity in depth, the style in sencha helped me a lot.

0
source

Source: https://habr.com/ru/post/1488426/

More articles:


All Articles