jquery - third font in font family is significantly larger -

-

For me, I have chosen to use some very vague fonts in my font family, the most famous font (third in the family) Centy is Gothic, which is the most computer 

  Font-family: Tw Cen MT, Gill Sans, Century Gothic, sans-serif;

The problem is that 12px ft TwCen MT & amp; nbsp; in Centennial Gothic Is more than a 12px font in the amp; Gill Sons If a computer comes back on the Century Gothic, then the fonts will be a mess I need a JCK solution that says, in the Gothic of the century 75% of the normal value will be the font size. I do not need it to detect fonts. I need to say that if the century is available, then make font size 75% of the normal value. any solution?

I think this issue is a relatively tall height of Century Gothic, with its font-size < Try using ex units in the code / declaration ex units are based on height, em , px , And pt .

line-height will also help normalize the height with a pixel-sized setting, but will cause problems for users who change the text zoom level in their browser .

Edit: I went back and tested, and did not help the former units. Century Gothic is both taller and more comprehensive than others.

The issue is, the DOM no will tell you which user is the specific font of your listed options, and CSS allows different font sizes (or adjustments) for each font Does not.

However, JQuery can test the size of a container of text, so if you provide a hidden element on your page with a known letter, you can You can test the breadth of that element on the user's browser.

Since the width of that letter will be determined by which the font user has installed, you can compare that width to your favorite font on the width of the same text on your own computer and that You can calculate the font size for the user who matches your purpose.

Example Code:

& lt; Style & gt; P {font-size: 15pt; Font-family: "Twin MT", "Gill Sons", "Century Gothic", Non-Serif; } P # testwidth {/ * Make sure the test is invisible and does not mess with borders, etc. * / margin: 0; Padding: 0; Border: None; White color; Display: inline; } & Lt; / Style & gt; & Lt; P & gt; Your text goes here. & Lt; / P & gt; & Lt; P id = "testwidth" & gt; M & lt; / P & gt; & Lt; Script language = "javascript" & gt; Window.onload = function () for font-size similar to your default CSS (just numbers, not units) var desired FontSize = 15; // test width when Tw ^ metric tons * * is available in pixels expected by Var = 17; // ml width, depending on which font is available var testwind = $ ('# testwidth'). Width (); // ratio, normalized fontosity = math at a decimal point Plain (expected width / test width desired font size * 10) / 10; // Change the style sheet to font size (in your favorite units) $ ('P') to "OK". CSS ('font-size', generalized fontsis + 'PT'); }

Four warnings:

  • It will not remove the each difference between the two alternate fonts I vertical alignment etc. Can not be correct if they do not have their preferred fonts.
  • It can disturb users who have a default text zoom level set in their browser because it's essentially the font size when the page loads. Fortunately, they still zoom in or out Can be desired and override your forced font size.
  • I think IE has a problem in font size with many numbers after the decimal, so I did the round. Must be enough.
  • I used the width of a letter "m" if you want a more accurate result, you do not wrap the user's browser (which will break the width test) provided can use a longer string letter. Some upper and lowercase letters and place should be a good test.

Comments

Post a Comment

Popular posts from this blog

oracle - The fastest way to check if some records in a database table? -

-
I have a big table to work with. I have to see that there are some records whose parent_id is equal to my passing value. Currently I do this by implementing "my_table using select count (*) where parent_id =: id"; If the result> 0, it means that they exist. Because this is a very large table, and I do not care what the actual number of records present, I just want to know if it exists, so I think count (*) Bit is disabled. How do I apply this requirement most quickly? I'm using Oracle 10. # Tips for Hibernation & amp; Tricks It suggests writing in such a way: Integer number = (integer) session .createQuery ("Select Count (*) to ...."). UniqueResult (); I do not know what is the magic of the unique rule? Why does it fast? To compare, select "1 from mytable where parent_id = passId and rowrum", which is more efficient? If you are not interested in the number of records, then there is an EXISTS query one: Select 'y'
Read more

php - multilevel menu with multilevel array -

-
Just ask someone to solve this problem? I want to create a multilevel menu I can not find the right solution generated with multilevel array, it always gets an array_push error My study came from the original idea But still my Can not match the need. This is my MySQL [code] ----- --------------------- --------------- | ID | PARENT_ID | Name | Link | Seq | 1 | 0 | Dashboad | Dashboard / | 1 | 2 | 0 | Menu 1 | Menu 1 / | 2 | 3 | 0 | Menu 2 | Menu 2 / | 3 | 4 | 0 | Menu 3 | Menu 3 / | 4 | 5 | 2 | Joint Add / | 1 | 6 | 3 | Joint Add / | 1 | 7 | 2 | Edit | Edit / | 2 | 8 | 4 | Joint Add / | 1 ------------------------------------------ [/ Code] I want to do something like this in my array array ('dashboard' = & gt; array ('id' = & gt; '' 'Dame' = & gt; 'Dashboard', 'Title' = & gt; 'Dashboard', 'MatchMin' = & gt; Base_URL (). 'Dashboard /', 'Active' => = & Gt; NULL), &
Read more

jQuery UI: Datepicker month format -

-
I am trying to change the format of the month that shows in the popup (not in the date that the picker actually I do not have any choice anywhere to do this, do I like to use a sub-string () or something else? What I normally display is Trying to change: Class = "ui-datepicker-title"> January & lt; / span & gt; ... & lt; / div & gt; Div>
Read more