Javascript 表格CCS样式请求

本页顶部的表单是用aweber制作的。我想创建一个这样的表单，但我无法像示例页面中那样将“注册”部分放在电子邮件字段的右侧。（平均水平形式）

示例页：

我想能够做同样的形式，你看到在样本页。我怎样才能在哪里换车

#af-form-586791810.af body.af textWrap{width:98%；display:block；float:none；}
#af-form-586791810.af body input.text，#af-form-586791810.af body textarea{background color:#ffffffff；border color:#454545；border width:1px；border style:solid；color:#454545；text装饰：none；字体样式：normal；字体重量：normal；字体大小：24px；字体系列：投石机MS，无衬线；}
#af-form-586791810.af主体输入.文本：焦点，#af-form-586791810.af主体文本区域：焦点{背景色：#FFFFFF；边框颜色：#454545；边框宽度：1px；边框样式：实心；}
#af-form-586791810.af正文标签.预览标签{显示：块；浮动：无；文本对齐：左；宽度：自动；颜色：#454545；文本装饰：无；字体样式：正常；字体重量：正常；字体大小：16px；字体系列：Helvetica，无衬线；}
#af-form-586791810.af正文{填充底部：15px；填充顶部：15px；背景重复：无重复；背景位置：继承；背景图像：无；颜色：继承；字体大小：16px；字体系列：Helvetica，无衬线；}
#af-form-586791810.af怪圈模式{右填充：60px；左填充：60px；}
#af-form-586791810.af标准.af元素{右填充：60px；左填充：60px；}
#af-form-586791810.按钮容器输入。提交{背景图像：无；背景颜色：4D0B4D；颜色：FFFFFF；文本装饰：无；字体样式：正常；字体重量：正常；字体大小：16px；字体系列：无衬线投石机MS；}
#af-form-586791810.按钮容器输入.提交{宽度：自动；}
#af-form-586791810.按钮容器{文本对齐：居中；}
#af-form-586791810按钮、#af-form-586791810输入、#af-form-586791810提交、#af-form-586791810文本区、#af-form-586791810选择、#af-form-586791810标签、#af-form-586791810选项组、#af-form-586791810选项{浮点：无；位置：静态；边距：0；}
#af-form-586791810分区{页边距：0；}
#af-form-586791810表单、#af-form-586791810文本区域、.af表单包装、.af表单关闭按钮、#af-form-586791810 img{浮点：无；颜色：继承；位置：静态；背景颜色：无；边框：无；边距：0；填充：0；}
#af-form-586791810输入，#af-form-586791810按钮，#af-form-586791810文本区，#af-form-586791810选择{字体大小：100%；}
#af-form-586791810选择、#af-form-586791810标签、#af-form-586791810选项组、#af-form-586791810选项{padding:0；}
#af-form-586791810，#af-form-586791810.怪圈模式{宽度：100%；最大宽度：418px；}
#af-form-586791810.af-quirksMode{overflow-x:hidden；}
#af-form-586791810{背景色：#FFFFFF；边框颜色：#454545；边框宽度：1px；边框样式：无；}
#af-form-586791810{显示：块；}
#af-form-586791810{溢出：隐藏；}
.af body.af textWrap{text align:left；}
.af正文输入。图像{边框：无！重要；}
.af body input.submit、.af body input.image、.af form.af元素input.button{float:none！important；}
.af正文输入。提交{空白：继承；}
.af body input.text{width:100%；float:none；padding:2px！important；}
.af-body.af-standards输入。提交{padding:4px 12px；}
.af clear{clear:两者；}
.af元素标签{文本对齐：左；显示：块；浮点：左；}
.af元素{填充底部：5px；填充顶部：5px；}
.af表单包装{文本缩进：0；}
.af表单{框大小：边框框；文本对齐：左；边距：自动；}
.af quirksMode.af元素{左填充：0！重要；右填充：0！重要；}
.lbl right.af元素标签{text align:right；}
身体{
}
#af-form-586791810输入。提交，
#af-form-586791810#网络表单提交按钮{
-webkit外观：无；
}
.af表格{
边界半径：12px；
}
.af标题{
-webkit剪辑路径：多边形（0,100%0,100%80,0%100%）；
剪辑路径：多边形（0,100%0,100%80,0%100%）；
}
.af标题p{
填充顶部：25px；
右边填充：50px；
填充底部：40px；
左侧填充：50px；
}
.af body input.text，
.af正文文本区域{
边界半径：4px；
}
.af元素{
填充顶部：10px；
垫底：10px；
}
#af-form-586791810选择，
#af-form-586791810标签，
#af-form-586791810 optgroup，
#af-form-586791810选件{
垫底：5px；
}
#af-form-586791810 p{
保证金：0；
}
#af-form-586791810。af主体。私有政策{
字体大小：9px；
填充顶部：20px；
垫底：10px；
}
#af-form-586791810。af机身。电源由{
字体大小：9px；
填充顶部：0；
填充底部：0；
}
#af表单#webFormSubmitButton，
.buttonContainer input.submit，
.af-body.af-standards input.submit{
边界：无；
边界半径：4px；
填充：10px 30px；
}
.bodyText p strong{
字母间距：0.03em；
线高：1.25；
}
.af格式.af元素无线电{
垫底：5px；
}
电邮：
//对不总是支持新窗口的应用程序内浏览器的特殊处理
（功能（）{
函数browserSupportsNewWindows（用户代理）{
风险值规则=[
“FBIOS”，
“iPhone推特”，
“网络视图”，
“（iPhone | iPod | iPad）（？！.*Safari\/）”，
“Android.*（wv|\.0\.0\.0）”
];
var pattern=newregexp（“（“+rules.join（“|”）+”），“ig”）；
return！pattern.test（userAgent）；
}
if（！browsersupportsnewindows（navigator.userAgent | navigator.vendor | window.opera））{
document.getElementById（'af-form-586791810'）.parentElement.removeAttribute（'target'）；
}
})();

只需将类名“refat”更改为所需的任意名称即可

添加CSS并将类名添加到id为af-form-586791810的父div中

示例：

//CSS

      .refat {
        display: flex;
      }
      .refat .af-element {
          padding: 0 !important;
      }
      .refat .buttonContainer {
        align-self: flex-end;
      }

//HTML

      <div id="af-form-586791810" class="af-form"><div id="af-body-586791810" class="af-body af-standards refat">

---

您可以使用绝对位置来实现这一点。在您的示例中，按钮位于输入上方

这不是一个好主意，如果你写一封很长的电子邮件，文本在按钮后面。 因此，您可以添加一个与按钮宽度相等的右边填充

见下文

提示：不要共享不必要的代码