Question

当我尝试使用飞碟9.1.19版将html转换为pdf时出现问题：

这是html代码和样式表：

.box {
    display: blockk;
	position: relative;
}
.box_text_bold {
	position: relative;
	float: left;
	width: 180px;
	overflow: hidden;
}
.box_text_bold::after {
    content: "";
    border-bottom: dotted;
    width: 100%;
    position: absolute;
    top: 17px;
}
.box_value {
	margin-left: 180px;
}
.sub_div {
	position: relative;
}
.sub_div::before {
    content: "";
    border-left: dotted;
    height: 100%;
    position: absolute;
    left: -15px;
}
.sub_div:last-child::before {
    height: 13px;
}
.sub_div_first {
	position: relative;
}
.sub_div_first::before {
    content: "";
    border-left: dotted;
	top: 13px;
    height: 13px;
    position: absolute;
    left: -15px;
}
.block_label {
  padding-left: 5px;
}
.block_label::before {
    content: "";
    border-top: dotted;
    width: 15px;
    position: absolute;
    left: -15px;
    top: 13px;
	bottom: -26px;
}
.block_value {
  padding-right: 5px;
}

<html lang="en">
<head>
<title>Test</title>
<link href="style-lite.css" rel="stylesheet" />
</head>
<body>
	<div class="box">
		<div class="box_text_bold">Date</div>
		<div class="box_value">03/03/2019</div>
	</div>

	<br/>

	<div style="padding: 15px;">
			<div class="sub_div_first">
				<span class="block_label">Block 1:</span>
				<span class="block_value">value 1</span>
			</div>

			<div class="sub_div">
				<span class="block_label">Block 2:</span>
				<span class="block_value">value 2</span>
			</div>

			<div class="sub_div">
				<span class="block_label">Block 3:</span>
				<span class="block_value">value 3</span>
			</div>
			
			<div class="sub_div">
				<span class="block_label">Block ...</span>
				<span class="block_value">value ...</span>
			</div>
			
			<div class="sub_div">
				<span class="block_label">Block n</span>
				<div style="padding-left:40px;">
					<div class="sub_div">
						<span class="block_label">Block n.1</span>
						<span class="block_value">data 1</span>
					</div>	
					<div class="sub_div">
						<span class="block_label">Block n.2:</span>
						<span class="block_value">data 2</span>
					</div>						
					<div class="sub_div">
						<span class="block_label">Block n.3:</span>
						<span class="block_value">data 3</span>
					</div>	
				</div>
			</div>
	</div>

</body>
</html>

这是浏览器中的渲染： html render

但是，当我使用飞碟9.1.19的最新版本将其转换为pdf时，会得到以下输出： pdf render

对于日期div，我不知道出了什么问题。

但是对于第二个div来说，问题应该是heigth = 100％，无法解释。

很高兴为这两个问题提供一些支持。

此致

A。

渲染高度= 100％的div时出现飞碟问题

0 个答案: