Loading ...
Sorry, an error occurred while loading the content.

validitity of CSS z-index increments

Expand Messages
  • Simon Kenyon Shepard
    Hi, A developer in my team is using the CSS code: z-index:+1; to increment the z-index of an element by one. This fails the JSLint validator, I cannot seem to
    Message 1 of 8 , Jan 27, 2010
    • 0 Attachment
      Hi,

      A developer in my team is using the CSS code: z-index:+1; to increment the
      z-index of an element by one. This fails the JSLint validator, I cannot seem
      to find any documentation on this practice. Does anyone know anything about
      it, whether it is valid and if it should pass Jslint?

      Thanks

      Simon

      --
      "We are the music makers, And we are the dreamers of dreams"


      [Non-text portions of this message have been removed]
    • pauanyu
      According to the W3C and MDC, z-index is either auto or an integer. The integer can be positive or negative, but if it is positive, it does not need the plus
      Message 2 of 8 , Jan 28, 2010
      • 0 Attachment
        According to the W3C and MDC, z-index is either "auto" or an integer. The integer can be positive or negative, but if it is positive, it does not need the plus sign. `z-index: +1` and `z-index: 1` should be equivalent; however the former is invalid, and the latter is valid.

        --- In jslint_com@yahoogroups.com, Simon Kenyon Shepard <simon.shepard@...> wrote:
        >
        > Hi,
        >
        > A developer in my team is using the CSS code: z-index:+1; to increment the
        > z-index of an element by one. This fails the JSLint validator, I cannot seem
        > to find any documentation on this practice. Does anyone know anything about
        > it, whether it is valid and if it should pass Jslint?
        >
        > Thanks
        >
        > Simon
        >
        > --
        > "We are the music makers, And we are the dreamers of dreams"
        >
        >
        > [Non-text portions of this message have been removed]
        >
      • pauanyu
        I did a little more digging, and here s what the W3C has to say about integers: http://www.w3.org/TR/CSS2/syndata.html#value-def-integer Basically, the + sign
        Message 3 of 8 , Jan 28, 2010
        • 0 Attachment
          I did a little more digging, and here's what the W3C has to say about integers:

          http://www.w3.org/TR/CSS2/syndata.html#value-def-integer

          Basically, the + sign is okay, but I would still recommend leaving it off. In addition to increasing the size of the code, it may cause problems in browsers that don't understand it. You can get the same results by using `z-index: 1`.

          --- In jslint_com@yahoogroups.com, Simon Kenyon Shepard <simon.shepard@...> wrote:
          >
          > Hi,
          >
          > A developer in my team is using the CSS code: z-index:+1; to increment the
          > z-index of an element by one. This fails the JSLint validator, I cannot seem
          > to find any documentation on this practice. Does anyone know anything about
          > it, whether it is valid and if it should pass Jslint?
          >
          > Thanks
          >
          > Simon
          >
          > --
          > "We are the music makers, And we are the dreamers of dreams"
          >
          >
          > [Non-text portions of this message have been removed]
          >
        • Fatih Piristine
          this should do that element.style.zIndex = element.style.zIndex + 1; Fatih ... From: Simon Kenyon Shepard Subject: [jslint]
          Message 4 of 8 , Jan 28, 2010
          • 0 Attachment
            this should do that

            element.style.zIndex = element.style.zIndex + 1;

            Fatih

            --- On Wed, 1/27/10, Simon Kenyon Shepard <simon.shepard@...> wrote:

            From: Simon Kenyon Shepard <simon.shepard@...>
            Subject: [jslint] validitity of CSS z-index increments
            To: "jslint_com" <jslint_com@yahoogroups.com>
            Date: Wednesday, January 27, 2010, 9:27 PM







             









            Hi,



            A developer in my team is using the CSS code: z-index:+1; to increment the

            z-index of an element by one. This fails the JSLint validator, I cannot seem

            to find any documentation on this practice. Does anyone know anything about

            it, whether it is valid and if it should pass Jslint?



            Thanks



            Simon



            --

            "We are the music makers, And we are the dreamers of dreams"



            [Non-text portions of this message have been removed]

























            [Non-text portions of this message have been removed]
          • Dominic Mitchell
            On Wed, Jan 27, 2010 at 8:27 PM, Simon Kenyon Shepard , each declaration is:
            Message 5 of 8 , Jan 28, 2010
            • 0 Attachment
              On Wed, Jan 27, 2010 at 8:27 PM, Simon Kenyon Shepard <
              simon.shepard@...> wrote:

              > A developer in my team is using the CSS code: z-index:+1; to increment the
              > z-index of an element by one. This fails the JSLint validator, I cannot
              > seem
              > to find any documentation on this practice. Does anyone know anything about
              > it, whether it is valid and if it should pass Jslint?
              >

              If you look at the CSS grammar <http://www.w3.org/TR/CSS21/grammar.html>,
              each declaration is:

              declaration : property ':' S* expr prio? ;

              "expr" is then defined as:

              expr : term [ operator? term ]* ;

              And "term" is:

              term :
              unary_operator? [ NUMBER S* | PERCENTAGE S* | LENGTH S* | EMS S* | EXS S*
              | ANGLE S* |
              TIME S* | FREQ S* ]
              | STRING S*
              | IDENT S*
              | URI S*
              | hexcolor
              | function
              ;
              So, *z-index: +1* looks like it's valid (unary_operator is "-" or "+").
              However, if you look at the definition of
              z-index<http://www.w3.org/TR/CSS21/visuren.html#z-index>,
              you see a further restriction: *Value: auto | <integer> | inherit*. Which
              means that you're only allowed an integer, not an expression.

              Of course, what browsers do is another matter entirely.

              -Dom


              [Non-text portions of this message have been removed]
            • Aseem
              Everyone seems to have missed what Simon said specifically (emphasis mine): A developer in my team is using the CSS code: z-index:+1; to _increment_ the
              Message 6 of 8 , Jan 28, 2010
              • 0 Attachment
                Everyone seems to have missed what Simon said specifically (emphasis mine): "A developer in my team is using the CSS code: z-index:+1; to _increment_ the z-index of an element by one."

                As others have noted in previous replies, setting z-index to +1 is equivalent to setting it to just 1. That is, the + says "positive" as opposed to "negative". It does _not_ imply increment.

                In other words, it is indeed technically valid, and arguably JSLint should be accepting it, but your developer is using it with the wrong intent.

                As far as I know, there's no way to increment the z-index using standard CSS.

                Aseem

                --- In jslint_com@yahoogroups.com, "pauanyu" <pcxunlimited@...> wrote:
                >
                > According to the W3C and MDC, z-index is either "auto" or an integer. The integer can be positive or negative, but if it is positive, it does not need the plus sign. `z-index: +1` and `z-index: 1` should be equivalent; however the former is invalid, and the latter is valid.
                >
                > --- In jslint_com@yahoogroups.com, Simon Kenyon Shepard <simon.shepard@> wrote:
                > >
                > > Hi,
                > >
                > > A developer in my team is using the CSS code: z-index:+1; to increment the
                > > z-index of an element by one. This fails the JSLint validator, I cannot seem
                > > to find any documentation on this practice. Does anyone know anything about
                > > it, whether it is valid and if it should pass Jslint?
                > >
                > > Thanks
                > >
                > > Simon
                > >
                > > --
                > > "We are the music makers, And we are the dreamers of dreams"
                > >
                > >
                > > [Non-text portions of this message have been removed]
                > >
                >
              • Douglas Crockford
                ... Part of JSLint s mission is to save us from confusion. In this instance, JSLint did exactly the right thing.
                Message 7 of 8 , Jan 28, 2010
                • 0 Attachment
                  --- In jslint_com@yahoogroups.com, "Aseem" <aseem.kishore@...> wrote:
                  >
                  > Everyone seems to have missed what Simon said specifically (emphasis mine): "A developer in my team is using the CSS code: z-index:+1; to _increment_ the z-index of an element by one."
                  >
                  > As others have noted in previous replies, setting z-index to +1 is equivalent to setting it to just 1. That is, the + says "positive" as opposed to "negative". It does _not_ imply increment.
                  >
                  > In other words, it is indeed technically valid, and arguably JSLint should be accepting it, but your developer is using it with the wrong intent.
                  >
                  > As far as I know, there's no way to increment the z-index using standard CSS.



                  Part of JSLint's mission is to save us from confusion. In this instance, JSLint did exactly the right thing.
                • Dominic Mitchell
                  ... +1 ! -Dom [Non-text portions of this message have been removed]
                  Message 8 of 8 , Jan 29, 2010
                  • 0 Attachment
                    On Thu, Jan 28, 2010 at 6:02 PM, Douglas Crockford <douglas@...>wrote:

                    > Part of JSLint's mission is to save us from confusion. In this instance,
                    > JSLint did exactly the right thing.
                    >

                    +1 !

                    -Dom


                    [Non-text portions of this message have been removed]
                  Your message has been successfully submitted and would be delivered to recipients shortly.