2 Replies Latest reply: Sep 3, 2014 3:22 PM by James Pike RSS

    Use same CSS as native QV objects?

      Is there anyway to make my extension object be based off the same CSS as the native QlikView objects?

       

      That is, in my extension object I have a SELECT that looks like so:

      Capture2.JPG.jpg

       

      And I want it to have the same look and feel as a native QlikView version of a listbox

      Capture.JPG.jpg

        • Re: Use same CSS as native QV objects?
          Jose Federico Moreno Penzo

          By default, QlikView apps use this link for their css:

           

          <link href="/QvAjaxZfc/htc/default.css" type="text/css" rel="stylesheet">

           

          If your extension object is revised to use the same css classes as the rest of the QlikView app, the visual style should be the same.

           

          For example, on a list box:

           

          element.style {

           

           

              border-left: 0 solid #dcdcdc;

           

              border-right: 1px solid #dcdcdc;

              height: 15px;

              left: 0;

              position: absolute;

              top: 0;

              width: 306px;

              z-index: 1;

          }

           

          .QvGrid div, .QvListbox div {

           

           

              -moz-user-select: none;

           

              text-decoration: inherit;

              text-overflow: ellipsis;

              word-wrap: break-word;

          }

           

          element.style {

           

           

              cursor: pointer;

           

              font-style: normal;

              font-weight: normal;

              text-align: left;

          }

           

          .QvGrid div, .QvListbox div {

           

           

              word-wrap: break-word;

           

          }

           

          .QvOptional {

           

           

              color: #363636;

           

          }

           

          .QvGrid div, .QvListbox div {

           

           

              word-wrap: break-word;

           

          }

           

          element.style {

           

           

              cursor: default;

           

              font-family: Arial;

              font-size: 9pt;

              font-style: normal;

              font-weight: normal;

              visibility: visible;

          }

           

          element.style {

           

           

              cursor: auto;

           

          }