Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

100% height div isnt working in Chrome when i print it

Tags:

html

height

I want to write a div for every print page. So i did height of div 100%. Normally in every browser it is working well. But when i print this page it is not working in Chrome.

<!DOCTYPE HTL>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">
<meta name="robots" content="noindex, nofollow">
<meta name="googlebot" content="noindex">
<meta http-equiv="cache-control" content="no-cache">    
<title>Brove.NET ISO Yazılımı</title>
<style>
html,body{
    padding:0;
    margin:0;   
    height:100%;
    width:100%;
}
.sayfa{
    height: 100%;   
    width: 768px;
}
</style>
</head>

<body>
<div class="sayfa" style="background-color:#666666">fds</div>
<div class="sayfa" style="background-color:#cccccc">fds</div>
<div class="sayfa" style="background-color:#aaaaaa">fds</div>


<script type="text/javascript" src="js/jquery-1.5.2.min.js"></script>   
</body>
</html>
like image 868
FURKAN ILGIN Avatar asked Jan 12 '12 12:01

FURKAN ILGIN


1 Answers

This is solution, man...

Try this code that is

@media print and (-webkit-min-device-pixel-ratio:0) {
.sayfa{
    height: 1101px;
    width: 768px;
}   
}
like image 172
RuudVanNistelrooy Avatar answered Nov 14 '22 22:11

RuudVanNistelrooy