主题移动端内边距问题求助：100px内边距自定义代码修复无效

Hey Sam, let's work through why your current CSS fix isn't sticking, and cover actionable steps to resolve that mobile padding problem:

• Confirm you're targeting the correct element
  Theme-generated classes like .vc_custom_1521831418432 might be attached to a parent container, but the actual 100px padding could be on a child element. Use your browser's dev tools (Chrome DevTools' device emulator works great here) to inspect the mobile view—hover over elements to see which one has the excessive padding. Adjust your selector to target that specific element directly if needed.

• Wrap your CSS in a mobile media query
  Most themes apply mobile-specific styles via media queries, so your custom code might be getting overridden because it's not scoped to mobile screens. Try wrapping your rules like this:

  @media (max-width: 768px) {
    .vc_custom_1521831418432 { 
      padding-left: 15px !important; 
      padding-right: 15px !important; 
    }
  }
  

  Tweak the max-width value to match your theme's official mobile breakpoint if you know it.

• Check for box-sizing conflicts
  If the element uses box-sizing: border-box (standard in most modern themes), padding is included in the element's total width—but this shouldn't block your override. That said, if the element has a fixed width forcing padding to stay large, add a width reset to your code:

  @media (max-width: 768px) {
    .vc_custom_1521831418432 { 
      padding-left: 15px !important; 
      padding-right: 15px !important;
      width: 100% !important;
      box-sizing: border-box !important;
    }
  }
  

• Boost your selector specificity
  Even with !important, a more specific selector in your theme's stylesheet might be winning. Use dev tools to check the element's computed styles—look for crossed-out padding rules and note which selector is overriding yours. Make your selector more specific (e.g., body .vc_custom_1521831418432 instead of just the class) to outrank the theme's rules.

• Clear all caches
  Mobile browsers and site caching plugins (like WP Rocket or W3 Total Cache) often hold onto old CSS files. Clear your site's server cache first, then wipe your mobile browser's cache to ensure your updated styles load properly.

Since you have a screenshot of the issue, pairing it with dev tool inspections of the problematic element will help you pinpoint the root cause even faster—this is usually the quickest path to a fix.

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