CSS Comment Validation Regex

Match CSS comments using regex pattern that handles multi-line comments with /* */ syntax.

Pattern Breakdown

\/\*[\s\S]*?\*\/

Components

Character Classes

• \/\* - Literal /* (forward slash and asterisk, both escaped)
• [\s\S] - Any character: \s (whitespace) OR \S (non-whitespace) = any character including newlines
• *? - Non-greedy quantifier: matches as few characters as possible
• \*\/ - Literal */ (asterisk and forward slash, both escaped)

Examples

Matches:

• /* This is a comment */
• /* Multi-line comment */
• /* Comment with code: .class { color: red; } */
• /* */ (empty comment)

Doesn't Match:

• // This is not a CSS comment (wrong syntax)
• /* Unclosed comment (missing closing)
• Comment without markers (no markers)

Implementation

JavaScript

const cssCommentRegex = /\/\*[\s\S]*?\*\//g; // 'g' flag for global
const css = 'body { color: red; } /* This is a comment */ p { margin: 0; }';
const comments = css.match(cssCommentRegex);
// ['/* This is a comment */']

// To remove comments
const withoutComments = css.replace(/\/\*[\s\S]*?\*\//g, '');

Python

import re
css_comment_regex = r'/\*[\s\S]*?\*/'
css = 'body { color: red; } /* This is a comment */ p { margin: 0; }'
comments = re.findall(css_comment_regex, css)
# ['/* This is a comment */']

# To remove comments
without_comments = re.sub(css_comment_regex, '', css)

Go

import "regexp"
cssCommentRegex := regexp.MustCompile(`/\*[\s\S]*?\*/`)
css := "body { color: red; } /* This is a comment */ p { margin: 0; }"
comments := cssCommentRegex.FindAllString(css, -1)
// ["/* This is a comment */"]

// To remove comments
withoutComments := cssCommentRegex.ReplaceAllString(css, "")

Limitations

1. No nested comments: Doesn't handle nested /* */ comments properly
2. Non-greedy matching: *? may not match all comments in some edge cases
3. No validation: Only matches format, doesn't validate comment syntax
4. Global flag needed: Requires global flag to find all comments
5. No position tracking: Doesn't track comment positions in source

When to Use

• Extracting CSS comments
• Removing comments from CSS
• CSS minification
• CSS parsing and processing
• Comment validation in CSS files

For production, consider:

• Handling edge cases with nested comments
• Tracking comment positions for source maps
• Preserving comments in minification if needed
• Using proper CSS parsers for complex operations
• Validating comment placement in CSS rules