Stylesheet overruled by default.css

[victa001]

Hello,

we're working on an extension wich uses external stylesheets.The problem is when

using the Ajax-client the stylesheets loaded with the extension are overruled by

the default stylesheet in de webserver (from the htc directory).

Is there any solution for this?

Our script (partly):

//company: Victa
//template variabel inladen
var template_path = Qva.Remote + "?public=only&name=Extensions/merken-table/";
function extension_Init() {
    Qva.LoadScript(template_path + "mobiscroll-2.4.1.custom.min.js", extension_Done);
    }
function extension_Done() {  
    Qva.AddExtension("merken-table", function () {
    Qva.LoadCSS(template_path + "jquery.mobile-1.2.0.min.css");
    Qva.LoadCSS(template_path + "team_selection.css");
    Qva.LoadCSS(template_path + "mobiscroll-2.4.1.custom.min.css");
        // data kunnen selecteren
          var _this = this;
        window.oncvlrowclick = function(rowIx)
            {
                _this.Data.SelectRow(rowIx);
            } 
            //unieke naam om conflicten met ID's te voorkomen
        var divName = _this.Layout.ObjectId.replace("\\", "_");
            if (_this.Element.children.length == 0 ) {
                var ui = document.createElement("div");
                ui.setAttribute("id", divName);
                _this.Element.appendChild(ui);
            } else {
            $("#" + divName).empty();
        }
...
...
...
extension_Init();

Thanks,

Victa

[Alexander_Thor · Accepted solution]

Hey,

Class style css should by default override any global css rules.

Or you could use the !important attribute to override any cascading atrribute.

You dont need to load jquery mobile, we load that for you.

I seem to have missplaced my old copy of mobiscroll but it should work.

[Anonymous]

Hi,

I realize that this is an old thread but I have some additional information for those who reads this on the path to getting custom CSS to work.

It is not so much the global.css that overrides, but the embedded CSS (CSS put straight into the "style"-tag of the elements).

But Alexanders answer still remains correct, using the !important attribute will override these.