水平对齐HubSpot表单

Question

我希望HubSpot表单像下面这样水平对齐。我使用了hubspot中的嵌入代码功能，它基本上链接到那里的JavaScript。

​

​

我试着摆弄这些参数http://designers.hubspot.com/docs/cos/hubspot-form-markup，但没有任何运气。

Answer 1

从这个链接开始，学习定制HubSpot表单嵌入代码的细节：http://developers.hubspot.com/docs/methods/forms/advanced_form_options

您的未设置样式的表单JS将如下所示：

<script charset="utf-8" type="text/javascript" src="//js.hsforms.net/forms/v2.js"></script> 
<script> 
    hbspt.forms.create({
        portalId: 'XXXXXXX',
        formId:   'XYZXYZXYZXYZ',
        css: '' // <-- Intentionally empty string! 
    });
</script>

为css提供空字符串将阻止代码段加载默认的hs-form样式表。

恭喜！现在，您可以使用自己的CSS样式表覆盖未设置样式的内容。在您自己的工作表中，定义需要在设计器文档中提到的类：http://designers.hubspot.com/docs/cos/hubspot-form-markup#styling-forms

如果我们没有做到这一点，并且您需要帮助定义自己的CSS类，请让我知道。

Answer 2

假设元素名称，因为我看不到你的代码。但这将会起到作用。

label,
button {
  display: inline-block;
}
input {
  display: inline-block;
  width: 30%;
}

Answer 3

这可以通过将CSS添加到特定的字段和按钮"display:inline-block;“或"float:left;”来实现，方法是为标签提供宽度