2016-03-03 2 views
-3

У меня есть этот HTML структуру:CSS для печати веб-страницы

<body> 
    <header></header> 
    <div class='main container'> 
    <div class='sidebar'></div> 
    <div class='content'> 
     <table id='sortthis'></table> 
    </div> 
    </div> 
    <footer></footer> 
</body> 

, но когда я пытаюсь напечатать предварительный просмотр, содержание оказывается немного в сторону вправо (который является его расположение на фактической странице).

Как сконцентрироваться на этом содержании? ИЛИ это вопрос некоторых невидимых элементов, занимающих пространство внутри страницы? Я почти уверен, что у меня их нет.

Я установил отображаемый элемент для максимальной ширины 215.9mm (размер @page: правовые; маржинальной: 12.7мм;)

EDIT:

@media print 
    { 
    body * {margin:0; padding:0} 
    body, #sortthis {border:1px solid #000;}  
    body header, body footer {display:none;} 
    div.main.container div.sidebar {display:none;} 
    div.main.container div.content > :not(#sortthis) {display:none;} 
    div.main.container div.content > #sortthis {color:#000;} 
    #sortthis tbody tr > td.exclude, #sortthis thead tr > th.exclude {display:none;} 
    #sortthis {margin:0 auto, padding:0; width:215.9mm;} 
    } 

    @page { 
    size: letter portrait; 
    margin: 12.7mm; 
    } 

ответ

-1

Вы можете настроить таблицу стилей для печати так что вы можете изменить макет, не затрагивая основные стили интерфейса.

Например:

@media print { 
    … 
} 
+0

я уже сделал, и его стиль как-то справа от страницы печати. пожалуйста, просмотрите мой css этого выше. – Valkyrurr

Смежные вопросы