много текста в пред теге вызывает разрыв страницы

У меня есть предварительный тег на моей странице, который содержит довольно много текста. Когда я просматриваю эту страницу в браузере, она выглядит нормально. Но когда я иду на его печать, все, что находится внутри предварительного тега, печатается на новой странице. Это как предварительный тег вызывает разрыв страницы.

Я использую css для переноса слов в текст предварительного тега.

Ниже приведен образец. Если вы просматриваете его в браузере, он выглядит хорошо, но если вы делаете предварительный просмотр, вы можете увидеть, как все в предварительном теге отображается на новой странице. Одинаковое поведение в IE7 и FF3.

Есть ли способ сделать этот отпечаток правильно?

    <html>
    <head>
        <title>Item</title>
    </head>

    <body>
    <p>Lets put some other stuff here. </p>
    <p>Lets put some other stuff here. </p>
    <p>Lets put some other stuff here. </p>
    <p>Lets put some other stuff here. </p>
    <p>Lets put some other stuff here. </p>
    <p>Lets put some other stuff here. </p>
    <p>Lets put some other stuff here. </p>

    <pre style="overflow-x: auto; width:99%; font-size:14px; font-family:Arial; word-wrap: break-word; white-space: -moz-pre-wrap;">Lorem ipsum dolor sit amet, consectetur adipiscing elit. Curabitur sit amet mauris ipsum, eget porttitor neque. Nunc eget eros eget turpis sagittis tincidunt quis vel leo. Praesent pretium, nisi sit amet ornare iaculis, justo nisi imperdiet libero, nec condimentum lacus metus eu diam. Cras eu eros id justo mollis pulvinar eget quis nisl. Proin gravida rutrum semper. Nunc erat lorem, volutpat at venenatis non, egestas eu magna. Vivamus nec lectus a justo hendrerit placerat. Aenean commodo, sem et facilisis sodales, tellus tortor sagittis ipsum, id interdum tortor velit sit amet massa. Maecenas placerat sollicitudin mollis. Cum sociis natoque penatibus et magnis dis parturient montes, nascetur ridiculus mus. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Suspendisse feugiat quam eget erat ornare vel ornare tortor fermentum. Cras at pulvinar turpis. Fusce ut magna eros, ut tristique tortor. Proin pulvinar fermentum massa eu rhoncus. In et sem ante. Sed malesuada dictum ullamcorper. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; Pellentesque enim sapien, pretium eget lacinia sit amet, mattis eget neque. 


Fusce ac nibh non arcu varius sodales ac sed massa. Fusce dapibus tincidunt nisl, et semper justo tincidunt nec. Phasellus rutrum hendrerit velit in posuere. Sed quis tempor urna. Aliquam eget nisl massa. Mauris ac erat vitae tortor molestie venenatis eget pretium velit. Curabitur id congue turpis. Quisque nec interdum nulla. In vitae libero a velit vehicula scelerisque vel nec lacus. Aliquam erat volutpat. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. Vestibulum dictum facilisis neque. 


Pellentesque elit ante, suscipit ut suscipit eu, placerat euismod sapien. Integer eu porttitor sapien. Curabitur sit amet elit at metus rutrum laoreet. Sed dignissim, dui vitae scelerisque imperdiet, est purus mattis urna, eget condimentum urna libero at libero. Praesent feugiat, nisl vitae cursus viverra, magna sem luctus ante, scelerisque vestibulum ligula mauris eget turpis. Nullam eget dapibus ante. Vestibulum interdum tincidunt velit, et tempor arcu euismod id. Donec vitae nibh nulla. Nulla quis mi quis nisl iaculis interdum. Aenean tincidunt felis semper orci scelerisque eget vulputate massa suscipit. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia Curae; In hac habitasse platea dictumst. Mauris tincidunt, est id suscipit porttitor, ipsum massa ultricies nunc, at tincidunt odio tellus quis est. Morbi vel turpis dolor. Mauris id turpis viverra tellus malesuada mattis a consectetur libero. Suspendisse sed turpis nibh. Cras vulputate arcu et risus fermentum fermentum. 


Nulla molestie diam consequat nisi mollis viverra. Ut non quam erat, sit amet pellentesque metus. Etiam nec sem id nisl scelerisque tristique. Curabitur molestie nibh aliquam justo sollicitudin sodales. Praesent sit amet nunc lobortis diam dignissim venenatis. Ut ipsum quam, rutrum id tempus at, porttitor eget justo. Nulla non malesuada velit. Duis laoreet mi nec turpis adipiscing lacinia. Duis nec libero massa. Cras elit felis, commodo sit amet tincidunt ut, commodo vitae augue. Nulla vitae magna ut lacus aliquam malesuada quis eu tellus. Maecenas aliquet urna tortor. Class aptent taciti sociosqu ad litora torquent per conubia nostra, per inceptos himenaeos. 


Mauris in lorem vel leo tempus eleifend. Nunc augue mauris, pellentesque quis blandit eget, ultricies nec mauris. Nullam posuere laoreet elit, vitae ullamcorper lorem bibendum at. Maecenas aliquet aliquet ligula vitae rhoncus. Curabitur est diam, commodo a porttitor in, imperdiet et lorem. Proin iaculis fringilla tortor sed bibendum. Nullam facilisis mauris et metus interdum tristique. Sed fermentum erat justo, eget rhoncus nibh. Fusce aliquam feugiat leo sodales condimentum. Maecenas tincidunt odio nec dui consequat sit amet dictum felis molestie. Ut id feugiat velit. Maecenas eget lacus at ligula porttitor consequat. Vestibulum ultrices, ante ut ornare hendrerit, metus mauris pellentesque neque, sed sodales diam diam a elit. 
    </pre>
    </body>
    </html>

Примечание. Кажется, что разрывы строк в разделе кода не поддерживаются. Поэтому, если вы копируете / вставляете этот код, вам нужно добавить разрывы строк, чтобы он отображался правильно. Я также скопировал файл на сервер, если вы хотите просмотреть, как он должен выглядеть: http://www.lakecountyfl.gov/test.htm

13.10.2009 14:14:34
2 ОТВЕТА
РЕШЕНИЕ

Если вы действительно не хотите, чтобы распечатка пропускала весь текст, который оказался на логической строке шире, чем физическая строка на бумаге, вам будет лучше использовать что-то кроме <pre>:

Возьмите строку из текстового поля, оберните ее абзацы <p>...</p>и затем отправьте ее в браузер, завернутый в <div>..</div>.

Или, что еще проще: отправьте « <p>...</p>где» ...ваше жало с переводами строки, только что замененными <br />(или <br>, соответственно).

0
23.10.2009 09:15:54

Я не понимаю этого. Какой смысл в использовании тега <pre>, если в любом случае браузер выполняет перенос слов?

0
13.10.2009 14:48:56
Pre используется для сохранения разрывов строк из текста, который был введен в текстовое поле.
Erikk Ross 13.10.2009 19:04:16
Я неправильно истолковал и, таким образом, был сбит с толку тегом «перенос слов». Если под «печатать правильно» вы подразумеваете печать одной страницы с несколькими строками «Давайте поместим еще кое-что сюда», за которыми следуют первые несколько символов текста в <pre> ... ну, это именно то, что мой FF35 делает. Однако вы теряете весь текст в <pre>, который не помещается на одной напечатанной строке. Если вы просто хотите сохранить разрывы строк, я думаю, вам лучше взять эту строку из текстового поля, обернуть ее абзацы в <p> ... </ p> и отправить ее в <div> .. . </ DIV>.
ndim 17.10.2009 15:54:04