SonarSource Rules
  • Products

    In-IDE

    Code Quality and Security in your IDE with SonarQube Ide

    IDE extension that lets you fix coding issues before they exist!

    Discover SonarQube for IDE

    SaaS

    Code Quality and Security in the cloud with SonarQube Cloud

    Setup is effortless and analysis is automatic for most languages

    Discover SonarQube Cloud

    Self-Hosted

    Code Quality and Security Self-Hosted with SonarQube Server

    Fast, accurate analysis; enterprise scalability

    Discover SonarQube Server
  • SecretsSecrets
  • ABAPABAP
  • AnsibleAnsible
  • ApexApex
  • AzureResourceManagerAzureResourceManager
  • CC
  • C#C#
  • C++C++
  • CloudFormationCloudFormation
  • COBOLCOBOL
  • CSSCSS
  • DartDart
  • DockerDocker
  • FlexFlex
  • GitHub ActionsGitHub Actions
  • GoGo
  • HTMLHTML
  • JavaJava
  • JavaScriptJavaScript
  • JSONJSON
  • JCLJCL
  • KotlinKotlin
  • KubernetesKubernetes
  • Objective CObjective C
  • PHPPHP
  • PL/IPL/I
  • PL/SQLPL/SQL
  • PythonPython
  • RPGRPG
  • RubyRuby
  • RustRust
  • ScalaScala
  • ShellShell
  • SwiftSwift
  • TerraformTerraform
  • TextText
  • TypeScriptTypeScript
  • T-SQLT-SQL
  • VB.NETVB.NET
  • VB6VB6
  • XMLXML
  • YAMLYAML
CSS

CSS static code analysis

Unique rules to find Bugs and Code Smells in your CSS code

  • All rules 26
  • Bug16
  • Code Smell10
 
Tags
    Impact
      Clean code attribute
        1. Expressions within "calc" should be valid

           Bug
        2. Selectors should be known

           Bug
        3. Single line comment syntax should not be used

           Bug
        4. "at-rules" should be valid

           Bug
        5. Media features should be valid

           Bug
        6. Pseudo-element selectors should be valid

           Bug
        7. Pseudo-class selectors should be valid

           Bug
        8. Shorthand properties that override related longhand properties should be avoided

           Bug
        9. Properties should not be duplicated

           Bug
        10. "!important" should not be used on "keyframes"

           Bug
        11. CSS properties should be valid

           Bug
        12. Units should be valid

           Bug
        13. "linear-gradient" directions should be valid

           Bug
        14. "calc" operands should be correctly spaced

           Bug
        15. Font declarations should contain at least one generic font family

           Bug
        16. Color definitions should be valid

           Bug

        Expressions within "calc" should be valid

        Bug

          This rule is deprecated, and will eventually be removed.

          Why is this an issue?

          To perform calculations when specifying a CSS property calc() function can be used. This function takes single expression as parameter. When writing this expression some rules must be respected:

          • no empty calc()
          • there should be an operator between the arguments
          • there should not be any division by zero

          Otherwise calc() function will be invalid and the entire rule using it will be ignored.

          Noncompliant code example

          .btn {
            border: solid black 1px;
            width: calc(100% 80px);  /* Noncompliant */
          }
          

          Compliant solution

          .btn {
            border: solid black 1px;
            width: calc(100% - 80px);
          }
          
            Available In:
          • SonarQube IdeCatch issues on the fly,
            in your IDE
          • SonarQube CloudDetect issues in your GitHub, Azure DevOps Services, Bitbucket Cloud, GitLab repositories
          • SonarQube Community BuildAnalyze code in your
            on-premise CI
            Available Since
            9.1
          • SonarQube ServerAnalyze code in your
            on-premise CI
            Developer Edition
            Available Since
            9.1

          © 2008-2025 SonarSource SA. All rights reserved.

          Privacy Policy | Cookie Policy | Terms of Use