我想把一张 A4 纸分成四个象限。然后将此 HTML/CSS 馈送到 PD 转换器。不知何故我无法让 float div 对齐(形成象限)。
HTML
<div class="q q1">1</div>
<div class="q q2">2</div>
<div class="q34">34</div>
CSS
@page {
size: A4;
margin: 0;
padding: 0;
}
body, div {
margin: 0;
padding: 0;
-moz-box-sizing: border-box;
-webkit-box-sizing: border-box;
box-sizing: border-box;
}
.q {
max-width: 50%;
max-height: 50%;
min-width: 50%;
min-height: 50%;
width: 50%;
height: 50%;
display:inline-block;
border: 1px solid grey;
}
.q34 {
max-width: 100%;
max-height: 50%;
min-width: 100%;
min-height: 50%;
width: 100%;
height: 50%;
display:inline-block;
border: 1px solid grey;
}
不知何故第二象限和底部不想适合模型(即移动到下一行)
我的问题:如何将象限 1 和象限 2 放在一条线上 (50/50)?如何将下半部分放在第 2 行(50% 高/全宽)?
最佳答案
只需添加:
.q { float: left; }
.q34 { clear: both; }
html, body{
height: 100%;
}
关于CSS - 使用 DIV 将 A4 分成四个象限进行打印,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/23868750/