html - 如何内联显示两个 ？

Question

<div class="wrap-input100 validate-input  mr-3">
  <input type="text" name="title" class="input100 text1" autocomplete="off" required>

  <span class="focus-input100" data-placeholder="Title"></span>
  <span class="count1 text-secondary"></span>

</div>

我需要同时显示 span排队。 display-inline: flex;似乎不起作用。

我有一个 CSS我从一个网站下载的，以风格化我的输入，CSS真的很大，所以我不能把这里剪下来。

代码笔链接:https://codepen.io/user236945896/pen/yRBLPM

Answer 1

我希望这是你想要的，因为你的问题不是很清楚。

<div class="wrap-input100 validate-input  mr-3">
  <input type="text" name="title" style="display:inline-block;width:auto;" class="input100 text1" autocomplete="off" required>

    <span class="focus-input100" style="width:auto" data-placeholder="Title"></span>
    <span class="count1 text-secondary"></span>

</div>

代码笔链接:https://codepen.io/anon/pen/NOKWmb