2 Replies Latest reply: Jan 8, 2015 10:44 AM by Kim Rørmark RSS

    Stylesheet overruled by default.css

    Carlo Vruwink

      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

        • Re: Stylesheet overruled by default.css
          Alexander Karlsson

          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.

          • Re: Stylesheet overruled by default.css
            Kim Rørmark

            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.