在wordpress右侧边栏中对齐右输入表单

Question

我有一个WordCress插件的MailChimp，表格代码是

<p>
    <label>Get new posts delivered to your inbox!</label>
    <input type="email" id="my-input" name="EMAIL" align="right" placeholder="Your email address" required />
</p>

<p>
    <input type="submit" value="Subscribe" />
</p>

侧边栏上看起来像这样：

除了我的输入表单外，似乎所有内容都在侧边栏中正确对齐。有一个我无法摆脱的边缘。

我可以像这样放置客户CSS，但它没有任何东西。

#my-input {
    text-align: right; /* This works */
    margin-right: 0px; /* This doesn't work */
}

有关编辑HTML或自定义CSS以使其正常工作的提示吗？

Answer 1

您可以尝试以下代码：

#my-input {
    text-align: right; 
    margin-right: 0 !important;
    display: block;
    width: 100%;
}

Answer 2

粘贴此

   #my-input {

margin-left: 320px !important;

width: 50%; }

你可以在这里查看https://www.w3schools.com/code/tryit.asp?filename=FPP4AWLPX1NP

Answer 3

在我的具体案例中，解决方案是

#my-input {
    width: 100%; /* Somehow width was not already 100% by default */
}

也许这是我正在使用的Customizr Wordpress主题中的一些东西搞砸了。

感谢@BM RAFIQ给我代码尝试，如果宽度100％不起作用，请尝试他写的其他代码。

Answer 4

如果您想对输入标记使用保证金，则必须指定width并使用display:block。看看这个question它可能对你有帮助。

我不推荐的另一种方法是使用!important。您可以在css中添加margin-right:0px !important;。