javascript - 更改下拉菜单中复选框的位置

标签 javascript html css

我使用这段代码创建了一个包含文本框的下拉菜单:https://stackoverflow.com/a/27547021

现在,我想移动此下拉菜单的位置以与某个 tekst 对齐。理想情况下,我希望它位于“Tekstpiece”的右侧。我尝试调整CSS,如下所示:https://www.w3schools.com/code/tryit.asp?filename=GDUL1WPE82S0

但是,下拉框的内容不会随框本身一起移动。此外,对位置进行硬编码可能不是最佳选择。

对于如何实现这一目标有什么想法吗?

最佳答案

将您的 html 更改为:

<!DOCTYPE html>
<html>
<h3>Tekstpiece</h3>
<form>
  <div class="multiselect">
    <div class="selectBox" onclick="showCheckboxes()">
      <select>
        <option>Select an option</option>
      </select>
      <div class="overSelect"></div>
      <div id="checkboxes">
      <label for="one">
        <input type="checkbox" id="one" />First checkbox</label>
      <label for="two">
        <input type="checkbox" id="two" />Second checkbox</label>
      <label for="three">
        <input type="checkbox" id="three" />Third checkbox</label>
    </div>
    </div>
  </div>
</form>
</html>

假设您希望下拉复选框与选择框“对齐”。

关于javascript - 更改下拉菜单中复选框的位置,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/61225532/

相关文章:

javascript - 尝试理解 browser.elementIdText 命令

javascript - 使窗口加载、滚动和调整大小中的 jQuery 代码只触发一次?

javascript - 如何使用 CSS 缩放 SVG 宽度?

javascript - IE8 有时不加载 CSS

for-of 循​​环中的 Javascript 引用

javascript - 为什么在检查之前会用 “var undefined;” 声明未定义?

python - 使用 Python 抓取价格列表

javascript - jQuery 动态标记所有复选框已选中

html - 320px 宽度设备上的左右填充神秘

css - div 容器在位置 : absolute 后收缩