如何将Mailchimp注册表单的复选框左对齐至对应文本左侧？

先修正你CSS里的两处语法错误（缺分号会导致布局异常）：

• #wrapper 的 width: 80% 后补分号，改为 width: 80%; overflow: auto;
• #mc_embed_signup 的 width: 60% 后补分号，改为 width: 60%; float:left;

接下来针对复选框与上方语句左对齐的需求，调整CSS布局并优化HTML结构：

修正后的完整CSS #

@font-face {
  font-family: museo-sans;
  src: url(/fonts/museosans_300.otf) format("opentype");
  font-display: auto;
  font-style: normal;
  font-weight: 300;
  font-stretch: normal
}

@font-face {
  font-family: museo-sans-bold;
  src: url(/fonts/museosans_700.otf) format("opentype");
  font-display: auto;
  font-style: normal;
  font-weight: 700;
  font-stretch: normal
}

@font-face {
  font-family: bwstretch;
  src: url(/fonts/BWSTRETCH-BLACK.OTF) format("opentype");
  font-display: auto;
  font-style: normal;
  font-weight: 800;
  font-stretch: normal
}

h2 {
  font-family: bwstretch;
  text-align: center;
  text-transform: uppercase;
  font-size: 2em !important;
}

* {
  margin: 0;
  padding: 0;
  border: none;
  font-family: museo-sans;
  color: #ffc860;
}

body {
  font-size: 1em;
  background-color: #191f43;
  font-family: museo-sans;
}

#wrapper {
  width: 80%;
  overflow: auto;
  background-color: #191f43;
}

#first {
  width: 40%;
  float: left;
  padding-left: 5%;
  background-color: #191f43;
}

#mc_embed_signup {
  width: 60%;
  float:left;
  overflow: hidden;
  background-color: #191f43;
  color: #ffc860;
  font-family: museo-sans;
}

/* 核心：让复选框与同意语句同行对齐 */
.content__gdpr > p:first-of-type {
  display: flex;
  align-items: center;
  gap: 8px;
}

#mc-embedded-subscribe-form input[type=checkbox] {
  width: auto;
  margin: 0;
}

/* 隐藏原单独的空fieldset */
#mergeRow-gdpr fieldset.mc_fieldset.gdprRequired {
  display: none;
}

#mergeRow-gdpr {
  margin-top: 20px;
}

#mergeRow-gdpr fieldset label {
  font-weight: normal;
}

#mc-embedded-subscribe-form .mc_fieldset {
  border: none;
  min-height: 0px;
  padding-bottom: 0px;
}

对应的HTML调整 #

将复选框直接嵌入同意语句的段落中，替换原单独的fieldset结构：

<div class="content__gdpr">
  <p>
    <input type="checkbox" id="gdpr_90860" name="gdpr[90860]" value="Y" class="av-checkbox gdpr">
    I agree to receive email communications from Opis Group Ltd
  </p>
  <fieldset class="mc_fieldset gdprRequired mc-field-group" name="interestgroup_field" style="display:none;">
    <label class="checkbox subfield" for="gdpr_90860"></label>
  </fieldset>
  <p>Your privacy is our policy. Occasionally, we'll contact you about our products and services, and other content that may be of interest. You can unsubscribe at any time.</p>
</div>

实现逻辑 #

1. 用flex布局让复选框与文字在同一行垂直居中，通过gap控制两者间距
2. 清除复选框默认边距，避免布局偏移
3. 隐藏原单独的空fieldset，避免冗余元素干扰布局

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