/    Sign up×
Community /Pin to ProfileBookmark

distance in pixels vs. points

Copy linkTweet thisAlerts:
Nov 16.2004

This is driving me nuts and I hope someone can point me in the right direction. Imagine the following picture:

[–A–][—-B—-]
[——-C——–]

where A, B and C are distances.

A is in pixels, C is in points.

I am trying to figure out the distance of B in points…
Well, obviously since A and C are in different units, C-A is not the answer.

A is a SPAN that contains text of different length, font face and font size so obviously it’s size varies. The clientWidth property of the span A always returns the value in pixels.

So, the answer is to convert pixels to points and then do my calculation. As I understand, I can get the current screen resolution from the browser but I can’t get dots per inch (DPI) making this calculation impossible(?)

So anyone have an idea? Thank you in advance.

to post a comment
JavaScript

6 Comments(s) ↴

Copy linkTweet thisAlerts:
@KorNov 16.2004 — Why not get [b]all[/b] the units in pixels? use offetWidth attribute for that.
Copy linkTweet thisAlerts:
@kolya3authorNov 16.2004 — Unfortunately that's not an option on my end. I am constrained by the current design of the system. I will be receiving this data in points.
Copy linkTweet thisAlerts:
@CharlesNov 16.2004 — You'll need to draw a 200pt line and a 200px line across the screen and then hold a scale up to each - and you'll need to do this for each screen and browser used by each user. From inside a computer you can know the number of pixels on a screen but neither you nor the browser can know how many pixels are in an inch. And as computers work with pixels, on a screen points are meaningless and vary in size.
Copy linkTweet thisAlerts:
@FangNov 17.2004 — [URL=http://www.w3.org/QA/Tips/font-size]Care with font size[/URL]:
Do not specify the font-size in pt, or other absolute length units. They render inconsistently across platforms and can't be resized by the User Agent (e.g browser).[/QUOTE]

Points should only be used in print media style sheets
Copy linkTweet thisAlerts:
@kolya3authorNov 17.2004 — Yes, I know points aren't a good idea in general for web work. I have to emulate on the screen what will come out of the user's printer. I have to use points. It's not a choice really. I am given points and that's what I have to work with because I only have design control over a small part of the overall system.

So the consensus is: my problem is not solvable as long as I'm using points?
Copy linkTweet thisAlerts:
@FangNov 17.2004 — You can not tell how the user has his printer setup.

Using a print media style sheet can emulate, to some degree, how the screen will print,

but you will rarely see the same layout on paper as on screen.
×

Success!

Help @kolya3 spread the word by sharing this article on Twitter...

Tweet This
Sign in
Forgot password?
Sign in with TwitchSign in with GithubCreate Account
about: ({
version: 0.1.9 — BETA 5.24,
whats_new: community page,
up_next: more Davinci•003 tasks,
coming_soon: events calendar,
social: @webDeveloperHQ
});

legal: ({
terms: of use,
privacy: policy
});
changelog: (
version: 0.1.9,
notes: added community page

version: 0.1.8,
notes: added Davinci•003

version: 0.1.7,
notes: upvote answers to bounties

version: 0.1.6,
notes: article editor refresh
)...
recent_tips: (
tipper: @AriseFacilitySolutions09,
tipped: article
amount: 1000 SATS,

tipper: @Yussuf4331,
tipped: article
amount: 1000 SATS,

tipper: @darkwebsites540,
tipped: article
amount: 10 SATS,
)...