Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Printing broken in IE11 and Firefox #21092

Closed
patrickhlauke opened this Issue Nov 6, 2016 · 8 comments

Comments

Projects
None yet
3 participants
@patrickhlauke
Copy link
Member

commented Nov 6, 2016

Using the v4 alpha documentation as a case in point, when printing in IE11 only the very first page is printed (instead of 17 or so pages, only 1 page is printed), while printing in Firefox results in all pages after the first one being offset to the left and cut off.

v4-print-firefox

xref: #21083 and #20814 (comment)

@patrickhlauke

This comment has been minimized.

Copy link
Member Author

commented Nov 6, 2016

Printing works correctly in Chrome, Safari and Edge though

@slavanga

This comment has been minimized.

Copy link

commented Nov 6, 2016

The *::first-letter selector in _print.scss is causing the problem in IE11:
https://github.com/twbs/bootstrap/blob/v4-dev/scss/_print.scss#L16

I could not reproduce this issue in Firefox v49.0.2 on Windows.

Related: h5bp/html5-boilerplate#1799

@patrickhlauke

This comment has been minimized.

Copy link
Member Author

commented Nov 6, 2016

@slavanga the first-letter issue was causing a crash. even after fixing it in alpha 5, printing itself isn't working correctly in IE. see #20814 (comment)

@patrickhlauke

This comment has been minimized.

Copy link
Member Author

commented Nov 6, 2016

Zeroing in on the issue at least in Firefox, it appears related to flexbox and the sidebar in the docs. As soon as the sidebar isn't there anymore in the printed version (pages 2 and onwards), the main content is moved off-paper by the same width as the sidebar would have taken up in the printout. This may be a bug with Firefox...

@patrickhlauke

This comment has been minimized.

Copy link
Member Author

commented Nov 6, 2016

As for IE11, initial trial and error suggests that removing

*,
  *::before,
  *::after,
  *::first-letter,
  p::first-line,
  div::first-line,
  blockquote::first-line,
  li::first-line {
    text-shadow: none !important;
    -webkit-box-shadow: none !important;
            box-shadow: none !important;
  }

from the bootstrap.css print styles also makes IE see/print the entirety of the page, rather than just the first page - likely a css parsing bug in IE?

@patrickhlauke

This comment has been minimized.

Copy link
Member Author

commented Nov 6, 2016

ah, apologies @slavanga ... i got confused with the issue i solved regarding ::first-line. it does indeed seem specifically about *::first-letter in IE. scoping this the same way it was scoped for ::first-line fixes at least the IE issue.

@patrickhlauke

This comment has been minimized.

Copy link
Member Author

commented Nov 8, 2016

The issue in Firefox appears to be a bug with how floated elements are handled across different pages - filed https://bugzilla.mozilla.org/show_bug.cgi?id=1315994

@cvrebert cvrebert added this to the v4.0.0-alpha.6 milestone Nov 29, 2016

cvrebert added a commit that referenced this issue Nov 29, 2016

@cvrebert

This comment has been minimized.

Copy link
Member

commented Nov 29, 2016

Firefox bug added to the Wall in f2bc3be.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
You can’t perform that action at this time.