首先要做的事情!
成分:水平对齐的两个div(每个都有父对象的宽度的50%)和一些文本放在第一个div(左),然后,如果溢出,在第二个div(右). div高200像素.
该文本来自一个PHP脚本,该脚本回显包含所有文本的变量(< p><?php echo $foo;?>< / p>).在括号中我写了一个< p>标签. DOM看起来像这样:
PHP echo $avariablewithsometext; ?>
问题:我正在尝试使用CSS flex属性来实现这个目标,但是我找不到一种方法来将第二个div中的溢出文本放在第二个div中.
问题:如何将溢出的文本放在第二个div中,使PHP脚本保持干净?
实际演示:
.thecontainer{
width:100%;
height:100px;
overflow: hidden;
display: block;
}
.therightone {
background-color: red;
width: 50%;
height:100px;
display: block;
float:right;
}
.theleftone {
background-color: blue;
width: 50%;
height:100px;
display:block;
float: left;
}
最佳答案
你可以使用CSS3 columns
.thecontainer {
width: 100%;
}
.theleftone {
background-color: lightblue;
columns: 2;
}
p {
margin: 0
}
原文链接:https://www.f2er.com/html/425579.html