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

Issues on Chrome (OSX) when printing pages containing select tags #11245

Closed
tagliala opened this Issue Oct 26, 2013 · 11 comments

Comments

Projects
None yet
4 participants
@tagliala
Contributor

tagliala commented Oct 26, 2013

Hi, searched for "select print", did not found results so I'm opening a new issue. Sorry if it's a dup

On Chrome (30.0.1599.101 stable and 31.0.1650.34 beta) for OSX 10.9, when you try to print a page containing a select tag, you will see two vertical lines for the whole height of the page, even if you don't apply form-control style.

http://jsfiddle.net/tagliala/X6jcy/

(press CTRL+P and take a look)

I was not able to understand what's wrong. I suppose it's chrome's fault. It doesn't happen without bootstrap (http://jsfiddle.net/tagliala/X6jcy/1), it doesn't happen with normalize (http://jsfiddle.net/tagliala/X6jcy/2/).

If it's chrome's fault, please help me to open a proper issue on their tracker

Screenshot attached:
image

@zdroid

This comment has been minimized.

zdroid commented Oct 26, 2013

Seems like some of print styles (taken from h5bp) afects the Chrome 31 beta print method.

A note: Bootstrap doesn't officialy support beta versions of browsers. 😉

@cvrebert

This comment has been minimized.

Member

cvrebert commented Oct 26, 2013

Does this also occur with non-beta stable Chrome?

@zdroid

This comment has been minimized.

zdroid commented Oct 26, 2013

No. Works well on v30.

2013/10/26 Chris Rebert notifications@github.com

Does this also occur with non-beta stable Chrome?


Reply to this email directly or view it on GitHubhttps://github.com//issues/11245#issuecomment-27149794
.

Zlatan Vasović - ZDroid

@cvrebert cvrebert closed this Oct 26, 2013

@tagliala

This comment has been minimized.

Contributor

tagliala commented Oct 26, 2013

Sorry but I'm always on the beta branch.

BTW I had chance to test canary, beta and stable and a windows machine

This is an OSX only issue, editing the first post

I'm able to reproduce it on 30.0.1599.101

Screenshot attached

image

@cvrebert cvrebert reopened this Oct 26, 2013

@zdroid

This comment has been minimized.

zdroid commented Oct 26, 2013

@tagliala Sorry, I don't use OS X, so I can't say is it bug or not, but seems like yes. Windows and Linux versions of Chrome reproduces this well. :)


If it's bug in our CSS, please test this case: select element with H5BP (without Bootstrap). If problem stays here, it is a H5BP print styles issue.

If it isn't issue with print styles, it can be an issue in our styles for select (not for .form-control).


If this isn't Bootstrap / H5BP print styles issue, report it at the Chrome issue tracker.

@tagliala

This comment has been minimized.

Contributor

tagliala commented Oct 26, 2013

@zdroid I'm digging into it to provide the chromium guys a minimum amount of code to deal with

http://jsfiddle.net/tagliala/X6jcy/7/

select {
    background: transparent;
}

This is not bootstrap's fault, neither h5bp's fault. background: transparent !important; (in print.less) in combination with box-sizing: border-box; is causing this.

My workaround:

@media print {
  select {
    background: #fff !important;
  }
}

PS: https://code.google.com/p/chromium/issues/detail?id=311975 for what it's worth...

@zdroid

This comment has been minimized.

zdroid commented Oct 26, 2013

Seems like adding white background styles helps. It's the best to send a
pull request with this fix! :)

P.S. Print styles are our fault. xD

2013/10/26 Geremia Taglialatela notifications@github.com

@zdroid https://github.com/ZDroid I'm digging into it to provide the
chromium guys a minimum amount of code to deal with

http://jsfiddle.net/tagliala/X6jcy/6/

select {
box-sizing: border-box;
background: transparent;}

This is not bootstrap's fault, neither h5bp's fault. background:
transparent !important; (in print.less) in combination with box-sizing:
border-box; is causing this.

My workaround:

@media print {
select {
background: white !important;
}
}

PS: https://code.google.com/p/chromium/issues/detail?id=311975 for what
it's worth...


Reply to this email directly or view it on GitHubhttps://github.com//issues/11245#issuecomment-27152694
.

Zlatan Vasović - ZDroid

@paulirish

This comment has been minimized.

Contributor

paulirish commented Oct 28, 2013

@zdroid just as an FYI

In Chrome land, Beta is the last-ditch chance to find bugs before shipping to stable. But you can think of it as Chrome stable's release candidate. If there is a bug in Beta and it's not reported, it's pretty much guaranteed to ship within in maximum of 6 weeks.

@tagliala thanks for reporting this upstream. I'll find an owner.

@zdroid

This comment has been minimized.

zdroid commented Oct 28, 2013

31 beta is not only problematic release. Windows and Linux Chrome versions
works well, but Chrome v30 and v31 for OS X have this bug. :(

2013/10/28 Paul Irish notifications@github.com

@zdroid https://github.com/ZDroid just as an FYI

In Chrome land, Beta is the last-ditch chance to find bugs before shipping
to stable. But you can think of it as Chrome stable's release candidate. If
there is a bug in Beta and it's not reported, it's pretty much guaranteed
to ship within in maximum of 6 weeks.

@tagliala https://github.com/tagliala thanks for reporting this
upstream. I'll find an owner.


Reply to this email directly or view it on GitHubhttps://github.com//issues/11245#issuecomment-27185134
.

Zlatan Vasović - ZDroid

@tagliala

This comment has been minimized.

Contributor

tagliala commented Oct 29, 2013

FYI My report was a DUP of this one reported two months ago: https://code.google.com/p/chromium/issues/detail?id=282918

There is something deeply wrong with me and the search bar on the chromium issue tracker, she hates me.

stempler pushed a commit to stempler/bootstrap that referenced this issue Apr 11, 2014

@cvrebert

This comment has been minimized.

Member

cvrebert commented Oct 1, 2014

As of Chrome 37.0.2062.124, the bug seems to have been fixed.

stempler pushed a commit to stempler/bootstrap that referenced this issue Nov 4, 2014

@cvrebert cvrebert added the browser bug label Apr 4, 2015

cvrebert added a commit that referenced this issue Apr 8, 2015

rm defunct workaround for OS X Chrome <select> printing bug
Chrome fixed the bug several versions ago
(see #11245 (comment) )
thus rendering this workaround unnecessary.

[skip sauce]
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment