CODEWITHSUNDEEP
htmlcssgoogle-chromeprintingmargins
Frank
Frank

Reputation: 323

Disabling printer default margin with css (with chrome)?

With Adobe Indesign it's possible to get this result:

enter image description here

I tried to get the same result with css

<style type="text/css" media="print">
@page 
{
    size: auto;   /* auto is the initial value */
    margin: 0mm;  /* this affects the margin in the printer settings */
}

body 
{
    background-color:#FFFFFF; 
    border: solid 1px black ;
    margin: 0px;  /* this affects the margin on the content before sending to   printer */
   }
</style>

but it's impossible to set the margins to 0. I always have a margin on the 4 sides:

enter image description here I'm using google chrome to do my tests. I also tried:

enter image description here

same thing, some little white margins on the 4 sides...what's wrong?

Any help would be appreciate. JsFiddle : https://jsfiddle.net/L63dc1yd/

Upvotes: 2

Views: 5538

Answers (2)

Frank
Frank

Reputation: 323

I found the issue. I haven't seen the option 'US Letter bordeless' in the page size selection list. The css was OK, it override the chrome default margin setting.

Upvotes: 1

blurfx
blurfx

Reputation: 1360

I think you can solve this problem with CSS3 Media Query.

@media print {
    html,body {
        margin: 0;
    }
}

Upvotes: 2

Related Questions