"Text data will be automatically cut at the end of a page and continue

I encountered the following issue

As depicted in the image

  1. The data is not being displayed properly
  2. In the next td, the last character 3 is also printed on the next line
  3. Is it possible to avoid page footer and header without adjusting the page margin?

I searched extensively for a solution, but the following code did not work for me in both Google Chrome and IE9:

<style>
@media print
{
  body { font-size:small; font-family: myOpenSans, Tahoma; font-size:13px; color:#808080; display:table-row}
  table { page-break-after:auto }
  tr    { page-break-inside:avoid; page-break-after:auto }
  td    { page-break-inside:avoid; page-break-after:auto }
  thead { display:table-header-group }
  tfoot { display:table-footer-group }
}
</style>
jqueryhtmlcss

Answer №1

If you're not sure if this is the solution you're seeking, here's a way to open the printing dialog in Internet Explorer and specify certain values from an ActiveX control. You can also remove the footer and header of the page and adjust the margins as needed.

function printSpecial() {
    try {

        var html = '<HTML><HEAD>\n';
        if (document.getElementsByTagName != null) {
            var headTags = document.getElementsByTagName('head');
            if (headTags.length > 0)
                html += headTags[0].innerHTML;
        }
        html += '<BODY style="background-color: #ffffff;">\n';
        var printReadyElem = document.getElementById('content');
        if (printReadyElem != null) {
            html += printReadyElem.innerHTML;
        }
        else {
            alert('Could not find the printReady function');
            return;
        }
        html += '</BODY></HTML>';

        shell = new ActiveXObject("WScript.Shell");
        shell.sendKeys('%fu'); //brings up page setup
        shell.sendKeys("%a{TAB}.2{TAB}0{TAB}0{TAB}0{TAB}0{TAB}0{TAB}{UP}{TAB}{UP}{TAB}{UP}{UP}{UP}{UP}{TAB}{UP}{UP}{ENTER}");
        window.setTimeout("shell.SendKeys('%fp')",1000); // brings up print dialog
    } catch (e) {
        alert ("An exception occurred: " + e + "\nCode is: " + e.number + "\nDescription is: " + e.description);
        alert('Please verify that your print settings have a Landscape orientation.');
    }
}

Similar questions

If you have not found the answer to your question or you are interested in this topic, then look at other similar questions below or use the search

Display function not functioning properly following AJAX request

I'm working on a functionality where I want to initially hide a table when the page loads, and then display it with the results when a form is submitted using Ajax. The issue I'm facing is that the code refreshes the page and sets the table back ...

javascriptjqueryhtmlcssajax

Mobile video created with Adobe Animate

Currently, I am designing an HTML5 banner in Adobe Animate that includes a video element. However, due to restrictions on iPhone and iPad devices, the video cannot autoplay. As a workaround, I would like to display a static image instead. Can anyone provid ...

javascriptcsshtmljquery-animateanimate-cc

Stop video and audio playback in an android webview

Is there a way to pause audio and video in an Android WebView without disrupting the page rendering? I have tried various methods but haven't found one that successfully pauses both the sound and the video without affecting the WebView. webView.onPau ...

javascriptandroidhtmlwebviewandroid-webview

Align navigation bar using Angular Material

Trying to center my navbar has been a struggle for me. I attempted using 'layout-align='space-between center' but it's not taking up 100% width and is acting more like an inline element. I've been following the documentation close ...

cssangularjsflexboxangular-material

Access information through token-based verification

Just starting out in this area of development, a colleague shared some information with me on how to retrieve the database. I'm feeling a bit lost as to what to do next. curl -X GET -H "Authorization: Token token=xxxxxxxxxxxxxxxxxxxxxxxxx" "https://w ...

javascriptjqueryhtmlajaxauthentication

The jQuery selector is unable to detect the Bootstrap modal when it is hidden

I attempted to change the value of a jQuery selector within a bootstrap modal, but unfortunately, my efforts were unsuccessful. Even after utilizing the Chrome console, I was unable to modify the value as intended. Could someone offer guidance on how to re ...

jquerytwitter-bootstrapbootstrap-modal

CSS: Obtain a button and align it to the "a" element

Feeling a bit puzzled: https://i.stack.imgur.com/S7xKh.png In the image, there's a span button labeled "Navigation einblenden", and a span a tagged as "Suche". Despite styling them identically: In the CSS snippet, dispOpts is the parent span's ...

htmlcss

Similar to Jquery ajax, Titanium also offers a powerful tool

Currently, I have been making an API call using Titanium in the following way: var url = "http://www.appcelerator.com"; var client = Ti.Network.createHTTPClient({ // callback when data is received onload : function(e) { Ti.API.info("Re ...

javascriptjqueryajaxtitaniumtitanium-mobile

Sending data from one HTML element to another using JQuery's Ajax function

I'm currently attempting to pass the value from an anchor tag into an ajax function. This is the HTML code I am working with <section> <div class="nav-section"> <nav> <ul> <li>< ...

jqueryajaxwordpress

Verify if the value present in the array exists and is less than the succeeding value within the same array

In the task at hand, I am tasked with verifying whether a value entered into an input field exists in an array and is smaller than the subsequent value in the same array. The purpose of this check is to adjust the quantity of items in a shopping cart. Cor ...

jqueryarraysjsonloopseach

To demonstrate movement through both revealing and concealing

Currently, I am working on an assignment that involves rotating an image on hover. My task is to rotate the image first, then animate another object once the image rotation is complete. Upon mouse out, the initial image should return to its original positi ...

javascriptjquery

Adding the !important rule in React inline CSS effortlessly

Is there a way to include !important in my inline CSS property without disrupting the entire style? import React from "react"; export default class Todo extends React.Component { render() { const {text} = this.props; const cardStyl ...

cssreactjs

Change the appearance of the page when it is being displayed within an iframe using CSS

How can I display a webpage differently using CSS if it is within an iframe? I would like to use jQuery or JavaScript to switch to a different stylesheet specifically when the site is being displayed within an iframe. Any suggestions on how to achieve th ...

javascriptjqueryhtmlcssiframe

Spacing before input text is found to be unnecessary and can be removed

Hello there, I've encountered a slight issue with a text input field that has border radius. The first character typed seems to protrude slightly outside the input field due to the border radius. Is there a way to add some extra whitespace before the ...

htmlcss

Looking for assistance with my website's navigation bar and logo

Looking for assistance in moving my navigation buttons to each side of the logo. As a beginner in web design and CSS, I've been struggling with this task. Essentially, I want the "home" and "about" buttons on the left side of the logo, 16px apart from ...

htmlcssnavigationmargingraphical-logo

Transferring information between pages through ajax communication

I am working with two pages named testing.php and submission.php. My goal is to send data from testing.php to be displayed on submission.php. For example, when a user clicks on test1, they should be directed to submission.php where I want to display the te ...

javascriptphpjqueryajax

Troubleshooting: Dealing with Access-Control-Allow-Origin Issue

While debugging a web app in Visual Studio 2013 Express for Web, I encountered the following error. This particular app is built with MVC using angularjs, jquery, and bootstrap. Interestingly, my other web apps are functioning without any issues and do not ...

jqueryasp.netangularjs

Setting the image source for each image in a table using VB.net

Is it more efficient to loop through the img src of various cells using a For Each loop and set their src based on another value (x) by directly referencing the img src attributes in code, or would embedding the table in a control higher up the hierarchy ...

htmlvb.net

Aligning HTML headers in a horizontal manner

Can anyone help me out here? I have a div containing 4 elements that are currently stacked on top of each other. I want them to be aligned horizontally instead. The div's ID is #ninesixty. Thank you in advance! HTML <header> <div id="ni ...

csshtmlweb

Styling with CSS: Making a div's height fit within another div, including padding

Looking at the image, there seems to be a div with a width of 100% and no defined height. Instead, the height adjusts based on the content, with top and bottom padding in percentages. The issue arises when trying to place navigation buttons on the right si ...

csshtml