我制作了一个待办事项应用程序，但您无法删除某些项目。我尝试了很多东西，但它不起作用。你能帮我理解错误的原因吗？我也在想办法增加字符限制。html:<!DOCTYPE html><!-- Created By Zarif Sefat --><html><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>SideQuests | Simple Todo App</title> <link rel="stylesheet" href="style.css"> <script src="https://kit.fontawesome.com/a076d05399.js"></script> <link rel="icon" href="images/icon.png"></head><body> <h1 class="logo-or-something"><i class="fas fa-check-square"></i> SideQuests</h1> <div class="wrapper"> <header>SIDE QUESTS</header> <div class="inputField"> <input type="text" placeholder="Add your new side quest"> <button><i class="fas fa-plus"></i></button> </div> <ul class="todoList"> <!-- data are comes from local storage --> </ul> <div class="footer"> <span>You have <span class="pendingTasks"></span> pending side quests</span> <button>Clear All</button> </div> </div> <script src="script.js"></script></body></html>
1 回答
一只甜甜圈
TA贡献1836条经验 获得超5个赞
如果你从你的 CSS 中删除它：
.todoList li{
overflow: hidden;
}
而且你会输入一个很长的输入，你就会看到问题出在哪里。并不是按钮不显示，而是按钮出现了。
当你的div太长时，按钮不会出现在同一行，而是较低，导致你看不到它。
要解决这个问题，您可以添加以下内容（隐藏的溢出已经存在）：
.todoList li{
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
设置hoverflow:hidden不允许您滚动，但整个文本仍然存在。另外两行将使 css 在没有更多空间时剪切文本。这将使您的按钮出现在正确的位置。
添加回答
举报
0/150
提交
取消