为何我的CSS代码提示1处错误？附对应代码片段

Hey Raju, I spotted the issue right away—your media query has a syntax mistake that's triggering the error.

The Root Cause #

You forgot to wrap your target selector and its styles inside curly braces {} right after the media condition. In CSS, media queries require that all styles meant to apply under the specified screen condition are enclosed within a pair of braces following the @media rule. Without these braces, the browser can't parse the rule structure correctly, which throws a syntax error.

Corrected Code #

Here's the fixed version of your CSS:

@media only screen and (max-width: 991px) {
  .mobile_header.top_nav_mobile .main_menu_nav > li > a { 
    padding: 11px 36px 11px 44px; 
    display: block; 
    font-size: 20px; 
    color: #ffffff; 
    text-transform: none !important; 
    font-weight: 700; 
    letter-spacing: -0.04em; 
  }
}

Quick Explanation #

• Added an opening { immediately after (max-width: 991px) to define the start of the media query block
• Added a closing } after the selector's styles to properly end the media query block

This will resolve the syntax error and ensure your mobile header styles apply correctly when the screen width is 991px or smaller.

内容的提问来源于stack exchange，提问作者Raju