html - HTML CSS在隐藏表单中的td中居中paypal按钮
问题描述
我正在编写一个付款页面以使用即时付款通知从 Paypal 付款。这个过程是通过POST
使用提交按钮和一堆隐藏的表单字段连接到 Paypal 开始的。根据布局,我有一个table
,其中一个td
是form
. HTML 如下所示:
<table>
...
<tr id="paymentRow"> <!-- shows the paypal payment information -->
<td valign="top">
<div style="min-height:50px;">
<br/>
<descriptive> Payment</descriptive>
</div>
</td>
<td style="vertical-align:middle; text-align:center;" >
<form style="width:0" action="https://ipnpb.sandbox.paypal.com/cgi-bin/webscr" onsubmit="return validate_payment_form(this)" method="post" />
<input type="image" src="https://www.paypalobjects.com/webstatic/en_US/i/buttons/checkout-logo-large.png" title="Check out with PayPal" alt="Submit" name="Submit" id="Submit"/>
<input type="hidden" name="cmd" value="_xclick" />
<input type="hidden" name="business" value="bob@bob.com" />
<input type="hidden" name="item_name" value="Test purchase item|CustomerID|1" />
<input type="hidden" name="no_shipping" value="1" />
<input type="hidden" name="return" value="https://mywebsite/paymentReceived.php" />
<input type="hidden" name="no_note" value="1" />
<input type="hidden" name="currency_code" value="GBP" />
<input type="hidden" name="amount" id="amount" value="1.00" />
<input type="hidden" name="logged_in" value="" />
<input type="hidden" name="<custom>" value="15" />
<input type="hidden" name="notify_url" value="https://mywebsite/paypalNotification.php" /><br />
</form>
</td>
</tr>
...
</table>
我的 CSS 文件中没有任何内容可以在不使用类的情况下设置 td 的对齐方式。
我遇到的问题是 paypal 按钮位于 td 的左上角,我希望它在中心/中间对齐。我的猜测是,这是因为它只是表单中的一个输入项。我如何实现这一目标?
解决方案
原因是因为你设置了表单样式:width:0
所以td
宽度也是0;因此,图像溢出并在左侧对齐(ltr 布局的默认对齐方式)。我不确定为什么将表单宽度设置为 0,但如果将其删除,您的图像将居中对齐。
推荐阅读
- python - 在 PyQt5 中没有触发 dropEvent
- javascript - 如何在控制台中使用 JS 在 Angular 中手动选择选项?
- javascript - Google 跟踪代码管理器中的代码仅在调试/预览模式下工作
- postgresql - 无法使用 ip 地址从本地 psql 连接到 postgresql
- python-3.x - 如何从数据类实例列表中填充 QtableView
- python - 如何将异常传递给 Django 中的 500 错误处理程序
- windows - 如何在 Linux 子系统中远程控制安装在 Windows 上的 Vagrant?
- javascript - 如何在 React 中显示点击按钮的名称?
- r - 将数值数据转换为 R 中的分类数据
- python - 如何防止 multiprocessing.pool 消耗我的所有内存?