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

doc: fix misaligned columns on Firefox/Linux #3948

Closed
wants to merge 1 commit into from

Conversation

silverwind
Copy link
Contributor

13em and 234px are equivalent here. By using the same unit as is used to specify the width of the TOC, we can work around a presumed Firefox layout bug, see nodejs/help#32.

@silverwind silverwind added the doc Issues and PRs related to the documentations. label Nov 21, 2015
@therebelrobot
Copy link

+1

@jmarca
Copy link

jmarca commented Nov 21, 2015

For what it's worth, as I commented on the nodejs/help#32 thread, if I change the body font size style from 62.5% to 100% it looks fine. To be explicit, I changed:


body {
  font-family: "Lato", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Verdana, Tahoma, sans-serif;
  font-size: 62.5%;
  margin: 0;
  padding: 0;
  color: #3a3a3a;
  background: #fcfefa;
}

to


body {
  font-family: "Lato", "Lucida Grande", "Lucida Sans Unicode", "Lucida Sans", Verdana, Tahoma, sans-serif;
  font-size: 100%;
  margin: 0;
  padding: 0;
  color: #3a3a3a;
  background: #fcfefa;
}

then 13em looks fine:

node_api_firefox2

@silverwind
Copy link
Contributor Author

Still pretty sure we're dealing with a browser bug here. We arrive at 18px font size through:

body { font-size: 62.5% } /* 10px */
#content { font-size: 1.8em } /* 18px */

Setting body to 100% would make the text way too large, at 28.8px 😉.

@jmarca
Copy link

jmarca commented Nov 21, 2015

Okay, you are right, not a bug! I restarted firefox with a new profile and the page renders fine. Must be some sort of cruft crept in over the years.

Sorry for the noise, thanks for helping me fix my firefox setup, I guess...

@silverwind
Copy link
Contributor Author

@jmarca thanks for confirming. I still think this patch is good to have either way.

@silverwind
Copy link
Contributor Author

Anyone able to rubberstamp a LGTM here? It's a bit unfortunate that this CSS isn't on the website repo.

@Fishrock123
Copy link
Contributor

Rubber-stamp LGTM if it works. It'd be good to test the built docs on a bunch of browsers though since we only update the docs site with releases.

@silverwind
Copy link
Contributor Author

Yeah, it was confirmed working by the user, I think it's good to use the same unit for the same distance to avoid weird browser bugs like this. Will land shortly.

silverwind added a commit that referenced this pull request Nov 27, 2015
By using the same unit for the offset of the main column as used for the
left column width, we ensure that browsers render the columns
conistently.

Ref: nodejs/help#32

PR-URL: #3948
Reviewed-By: Jeremiah Senkpiel <fishrock123@rocketmail.com>
@silverwind
Copy link
Contributor Author

Landed in 8b75030. I'll remember to test the docs in more browsers, thanks.

@silverwind silverwind closed this Nov 27, 2015
silverwind added a commit that referenced this pull request Dec 1, 2015
By using the same unit for the offset of the main column as used for the
left column width, we ensure that browsers render the columns
conistently.

Ref: nodejs/help#32

PR-URL: #3948
Reviewed-By: Jeremiah Senkpiel <fishrock123@rocketmail.com>
silverwind added a commit that referenced this pull request Dec 4, 2015
By using the same unit for the offset of the main column as used for the
left column width, we ensure that browsers render the columns
conistently.

Ref: nodejs/help#32

PR-URL: #3948
Reviewed-By: Jeremiah Senkpiel <fishrock123@rocketmail.com>
silverwind added a commit that referenced this pull request Dec 5, 2015
By using the same unit for the offset of the main column as used for the
left column width, we ensure that browsers render the columns
conistently.

Ref: nodejs/help#32

PR-URL: #3948
Reviewed-By: Jeremiah Senkpiel <fishrock123@rocketmail.com>
@jasnell jasnell mentioned this pull request Dec 17, 2015
silverwind added a commit that referenced this pull request Dec 17, 2015
By using the same unit for the offset of the main column as used for the
left column width, we ensure that browsers render the columns
conistently.

Ref: nodejs/help#32

PR-URL: #3948
Reviewed-By: Jeremiah Senkpiel <fishrock123@rocketmail.com>
silverwind added a commit that referenced this pull request Dec 23, 2015
By using the same unit for the offset of the main column as used for the
left column width, we ensure that browsers render the columns
conistently.

Ref: nodejs/help#32

PR-URL: #3948
Reviewed-By: Jeremiah Senkpiel <fishrock123@rocketmail.com>
scovetta pushed a commit to scovetta/node that referenced this pull request Apr 2, 2016
By using the same unit for the offset of the main column as used for the
left column width, we ensure that browsers render the columns
conistently.

Ref: nodejs/help#32

PR-URL: nodejs#3948
Reviewed-By: Jeremiah Senkpiel <fishrock123@rocketmail.com>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
doc Issues and PRs related to the documentations.
Projects
None yet
Development

Successfully merging this pull request may close these issues.

6 participants