当我单击以阅读更多内容时,右移栏上的文本。我需要他们保持原样。我需要列表左下方的“显示更多”按钮。有什么方法可以通过调整代码来解决此问题。我是Java语言的新手,所以我无法解决这个问题。
(click)="activeModal.dismiss('Cross click')"
function myFunction() {
var dots = document.getElementById("dots");
var moreText = document.getElementById("more");
var btnText = document.getElementById("myBtn");
if (dots.style.display === "none") {
dots.style.display = "inline";
btnText.innerHTML = "Read more";
moreText.style.display = "none";
} else {
dots.style.display = "none";
btnText.innerHTML = "Read less";
moreText.style.display = "inline";
}
}
#more {
display: none;
}
.columns {
columns: 2;
-webkit-columns: 2;
-moz-columns: 2;
float: left;
position: relative;
}
.hed {
font-size: 16px;
font-weight: 800;
list-style: none;
margin: 15px 0px 5px;
}
答案 0 :(得分:0)
您的按钮不在所需列表下方的原因是,您的无序列表columns
具有float: left
。也许column-gap
可以达到您想要的外观。
列表项四处移动的原因是因为您的列是自平衡的。一次添加的项目越多,偏移量就越大,您可能会注意到,如果仅替换一项,则各列将保持不变。也许您可以尝试column-fill: auto
? https://www.w3schools.com/cssref/css3_pr_column-fill.asp