Question

我使用Codeigniter的Captcha助手。

当我在表单上回显图像时，它总是将下一个元素推送到新行。

如何显示与验证码图像内联的输入字段？

  .captcha img
  {
    display:inline;
    float:left;
  }
</style>

<tr>
    <td height="35" align="right">กรอกรหัสภาพ</td>
    <td valign="bottom"></td>
    <td valign="bottom">
        <div class="captcha"><?php echo $captcha['image']; //this is img tag so you can style it through img ?>
        <input name="userCaptcha" type="text" value="<?php if(!empty($userCaptcha)){ echo $userCaptcha;} ?>"  style="width:80px;float:left;" />
        </div>
    </td>
</tr>

Answer 1

您应该在<span>标记中包含输入文本字段，请参阅下面的

<span style="float:left;">
    <?php echo $captcha['image']; ?>
    <input name="userCaptcha" type="text" value="<?php if(!empty($userCaptcha)){ echo $userCaptcha;} ?>" class="input_zone" style="width:80px;float:left;" />
</span>

如果它不起作用，您可以尝试其他标记，例如<div>并更新样式，请参阅我的样本

<div style="display:inline; float:left;">
    <?php echo $captcha['image']; ?>
    <input name="userCaptcha" type="text" value="<?php if(!empty($userCaptcha)){ echo $userCaptcha;} ?>" class="input_zone" style="width:80px;float:left;" />
</div>

Answer 2

只需添加此样式：

.captcha{display:inline; }

并从float:left;阻止内删除<input。

Answer 3

float：left和display：行根本不起作用但好吧，我用

WKWatchConnectivityRefreshBackgroundTask

它有效。

验证码图像无法显示内联

3 个答案: