正文边距在 WordPress CSS 主题上不起作用

Question

我有这个wordpress主题，边距主体或包装器不起作用，我尝试了所有主体边距，包装器边距，避免了大多数可能的冲突。但我仍然在浏览器中看到我的样式 main.css 和浏览器 css 之间存在冲突。

在移动或桌面模式下不显示边距。

这是wordpress 中的一个主题。我用 chatGpt 尝试了一些东西，但都是徒劳的，

.wp-site-blocks {

  font-family: "Manrope", sans-serif;
  color: #000000ff;
  background-color: #FEFEFEff;
  min-height: 100vh;
  font-size: 1.2em;
}



.wp-elements-1c2ee1c28516952df80b30df07526130 a:where(:not(.wp-element-button)) {
  text-decoration: none;
  text-align: center;
}

body>div.wp-site-blocks>div>div>footer>div ul li a {
  text-decoration: none;
  color: white;
  list-style: none;
  margin-right: 30px;

}

body>div.wp-site-blocks>div>div>footer>div p {
  margin-left: 39px;
}

body>div.wp-site-blocks>div>div>footer>div ul li {
  list-style: none;
}


body>div.wp-site-blocks>div>div>footer>div ul li a:hover {
  color: rgb(235, 42, 42);
}

.wp-site-blocks p {
  margin-bottom: 2em;
  font-family: "Manrope", sans-serif;
}


.query-works h1,
.query-works h2 {

  color: black;

}



.wp-site-blocks h1,
.wp-site-blocks h2,
.wp-site-blocks h3 {
  color: #1e1e1e;
  font-size: 2em;
}



.wp-site-blocks h1 {
  font-size: 3rem;
  font-family: "Overpass", sans-serif;
}


#modal-1-content {
  display: flex;
  justify-content: center;
  align-items: center;
}


#modal-1-content>ul {
  font-weight: 600;
  text-align: center;
  padding-bottom: 10px;
  align-items: center;

}

#modal-1-content>ul>li {

  width: 140px;
  justify-content: center;

}


#modal-1-content>ul>li>a {

  width: 100%;
  transition: all 0.3s;
  font-size: 1em;
  padding-bottom: 2em;

}

#modal-1-content>ul>li>a:hover {

  color: #ff2d2c;
  font-weight: bold;
  box-shadow: inset;
}

.wp-site-blocks figure>img {

  width: 50rem;
  height: auto;
}






.main-nav {
  padding: 20px;
  color: rgb(0, 0, 0);
}

.main-nav ul li a {
  text-decoration: none;
  color: rgb(0, 0, 0);

}


.main-nav ul li a:hover {
  color: #ff2d2c;

}

.site-title a {
  text-decoration: none;
  color: black;
}

wp-site-blocks .site-title {
  color: black;
}

.query-posts a {
  text-decoration: none;
  color: #FF0000;
}

.wp-block-social-links {
  display: inline-block;
  list-style: none;
  padding: 0;
}

.wp-block-social-links li {
  display: inline-block;
 margin-right: 10px;

}

.wp-block-social-links li:last-child {
  margin-right: 0;

}

Answer 1

I tried these solutions but none of them worked:
body {
    margin: 0 !important;
}
 

body {
    margin: 8px !important;
}

  

/* Set maximum width for the body */
body {
    max-width: 1200px;
    margin: 0 10px; /* Add margin to the body */
    padding: 0; /* Reset padding */
    box-sizing: border-box; /* Include padding and border in the element's total width and height */
}

  

body {
    max-width: 1200px;
    margin: 0 auto; /* Center the body horizontally */
    padding: 0 10px; /* Adding padding to create space on the sides */
}

/* Center the wrapper horizontally */
.wrapper {
    margin: 0 10px; /* Add margin to the wrapper */
}