The Web Design Group

... Making the Web accessible to all.

Welcome Guest ( Log In | Register )

2 Pages V  1 2 >  
Reply to this topicStart new topic
> can you have different sizes per font?, With CSS
NovaArgon
post Apr 22 2008, 01:10 PM
Post #1


Always Need To Learn A New Code
*****

Group: Members
Posts: 265
Joined: 10-June 07
From: South Carolina
Member No.: 3,057



I want this to be the first font that my page will check to see if a user has and so on.

Chiller size 170%, Georgia size 100%, sans-serif size 100%, serif size 100%

How do I do this?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Apr 22 2008, 01:36 PM
Post #2


WDG Member
********

Group: Root Admin
Posts: 8,365
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



CSS 2 included the font-size-adjust property, but support never materialized and it was dropped from CSS 2.1. CSS 3 may reintroduce font-size-adjust.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Apr 22 2008, 01:40 PM
Post #3


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6



No, there's nothing that can do it exactly like that, but there is a property called 'font-size-adjust'.
http://www.w3.org/TR/CSS2/fonts.html#propd...ont-size-adjust
The purpose is to give whatever font the user may have the same perceivable size as your first hand choice. Note that W3C's list of aspect values there probably contains errors.

This is not supported by IE. I don't know what browsers that support it now. Earlier it was only Mozilla/FF. There's a lot of information on the web saying that NO browser supports it or that Mozilla gets it wrong, but that's simply not true. Mozilla has supported this and done it right since long before version 1. I don't know why people keep insisting the opposite. A matter if quoting eachother, I guess.

So, you can get it to work at least in FF and maybe in more browsers now.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Apr 22 2008, 01:43 PM
Post #4


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6



Sorry, Darin. I didn't refer to you when I said people insist there's no support! You posted while I typed. Hmm, hope FF hasn't gone and dropped it. Must check.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
NovaArgon
post Apr 22 2008, 01:53 PM
Post #5


Always Need To Learn A New Code
*****

Group: Members
Posts: 265
Joined: 10-June 07
From: South Carolina
Member No.: 3,057



Thanks guys for all your advice.

I am sure not to many people are going to have chiller so It looks like i'm going to have to drop it.

User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Apr 22 2008, 02:02 PM
Post #6


WDG Member
********

Group: Root Admin
Posts: 8,365
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



Well, when CSS 2.1 came out, they wanted "at least two interoperable implementations for every feature". Plus, Firefox wasn't as widely used as it is now.

From the spec, font-size-adjust is targeted at accommodating the difference in aspect value among different fonts. But ornamental typefaces can be harder to read than their aspect value might indicate. I'm not sure how this plays out, if you're using font-size-adjust and have multiple ornamental typefaces in your preferences list. The browser is going to adjust the font sizes based on the actual aspect value, so you really can't fudge it. I think you just have to live with any non-ornamental fonts in your preferences list being displayed larger than you might otherwise want.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Apr 22 2008, 02:13 PM
Post #7


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6



Yes, odd stuff can probably happen. Anyway, Gecko still supports it AND Opera and Safari also do now. That's all I tried. smile.gif
http://web.telia.com/~u18121512/font-size-adjust.html

First para - Verdana at 12px
Second para - Courier New at 12px
Third para - Courier New at 12px adjusted approximately to Verdana's aspect value.


NovaArgon, the way I've use it in that page isn't how you are supposed to use it, but I had to force things to show it in work.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Darin McGrew
post Apr 22 2008, 02:23 PM
Post #8


WDG Member
********

Group: Root Admin
Posts: 8,365
Joined: 4-August 06
From: Mountain View, CA
Member No.: 3



There seems to be a typo in your CSS. (Also, I had to turn off my minimum font size. Is the effect easiest to see at small font sizes?)
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Apr 22 2008, 02:28 PM
Post #9


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6



That's what dragging text does to you. I should have validated, huh? laugh.gif Hope it's right now.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
NovaArgon
post Apr 22 2008, 06:43 PM
Post #10


Always Need To Learn A New Code
*****

Group: Members
Posts: 265
Joined: 10-June 07
From: South Carolina
Member No.: 3,057



Thanks so much. Does it matter if I use px or %?

I'm going to play around with it thanks so much
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
NovaArgon
post Apr 22 2008, 09:04 PM
Post #11


Always Need To Learn A New Code
*****

Group: Members
Posts: 265
Joined: 10-June 07
From: South Carolina
Member No.: 3,057



Would you mind giving me a little more detail?

I can't get this to work my dreamweaver. I am trying to make the same block of text have the different sizes depending on if the user has the first text or not.

Like for example

My pc has Text1 and Text2 but not very many people have Text1 but everyone has Text2

At 100% Text1 is this size

Text1Text1Text1Text1Text1Text1Text1

and at 100% Text2 is this size

Text2Text2Text2Text2Text2Text2Text2

So what I am trying to do is set Text1 to 170% so that everyone one who has Text1 on there pc can see it at a large enough size but in doing this it also sets Text2 to 170% whitch makes it way way to large. It's the same paragraph. The only reason anyone would ever see Text2 is if they don't have text one.

I can only test this in dreamweaver.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
NovaArgon
post Apr 22 2008, 10:08 PM
Post #12


Always Need To Learn A New Code
*****

Group: Members
Posts: 265
Joined: 10-June 07
From: South Carolina
Member No.: 3,057



This was posted on a different forum but I cant get it to work.

QUOTE
I don't think that this can be achieved unless you use javascript, and with the javascript, I don't know how if you do use javascript. You'll have to find a function that can find if the font exists. But what I suggest is going in your Fonts(if you have Vista you can type this in your windows explorer: Control Panel\Appearance and Personalization\Fonts you can try it with XP too, but I don't know if it'll work). Find the font, then drag it into your FTP, you can then type something like:

CODE
font-family: 'chiller.ttf';


And that will display the font from the server, so everyone can view the same font.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
NovaArgon
post Apr 23 2008, 12:14 AM
Post #13


Always Need To Learn A New Code
*****

Group: Members
Posts: 265
Joined: 10-June 07
From: South Carolina
Member No.: 3,057



That didn't work... Something about php

Well maybe this http://www.mikeindustries.com/blog/sifr/

Have you guys ever heard of it?
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Apr 23 2008, 02:08 AM
Post #14


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6



What that guy says is wrong. You can embed fonts, but it only works in MSIE and it isn't done as easily as he describes it. You nead a special font format made with a special program and there's more to the CSS than what he posted. I wouldn't bother.

QUOTE

never heard of that.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Apr 23 2008, 02:11 AM
Post #15


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6



QUOTE(NovaArgon @ Apr 23 2008, 04:04 AM) *

I can only test this in dreamweaver.


Why? Don't you have any browsers? tongue.gif No one surfs with DW preview, so why bother with what it supports and not?

How did you do it? Let's see.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
NovaArgon
post Apr 23 2008, 02:26 AM
Post #16


Always Need To Learn A New Code
*****

Group: Members
Posts: 265
Joined: 10-June 07
From: South Carolina
Member No.: 3,057



www.drysnot.com

I changed my images up some and set the animated ones to appear first. I think I could replace the non animated ones with text since they are now on the background but thats for another day.

As far as the text goes I'm still working on it lol I never managed to get your code to work. I think i was doing the css part wrong.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
pandy
post Apr 23 2008, 02:33 AM
Post #17


🌟Computer says no🌟
********

Group: WDG Moderators
Posts: 20,730
Joined: 9-August 06
Member No.: 6



Don't find any font-size-adjust.
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
NovaArgon
post Apr 23 2008, 02:48 AM
Post #18


Always Need To Learn A New Code
*****

Group: Members
Posts: 265
Joined: 10-June 07
From: South Carolina
Member No.: 3,057



I can't think any more its almost 4am I think i'm going to get some sleep wacko.gif

Maybe I will come up with something in my dreams lol.

I'll try some more stuff in the morning but I was thinking that if I go through the hundreds of fonts and pick out all the ones that I think look cool on my site the surly my users will be bound to have at least one of them. unsure.gif
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Apr 25 2008, 05:07 AM
Post #19


.
********

Group: WDG Moderators
Posts: 9,656
Joined: 10-August 06
Member No.: 7



QUOTE(NovaArgon @ Apr 23 2008, 07:14 AM) *

That didn't work... Something about php

Well maybe this http://www.mikeindustries.com/blog/sifr/

Have you guys ever heard of it?

I've read about a similar trick, where PHP creates images with text on (so you don't need to start a graphics program in order to change the text on an image). This should only be practical for e.g. headers and similar short texts.

Regarding font embedding in MSIE, google for "WEFT".
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post
Christian J
post Apr 25 2008, 05:19 AM
Post #20


.
********

Group: WDG Moderators
Posts: 9,656
Joined: 10-August 06
Member No.: 7



QUOTE(NovaArgon @ Apr 23 2008, 09:48 AM) *

if I go through the hundreds of fonts and pick out all the ones that I think look cool on my site the surly my users will be bound to have at least one of them. unsure.gif

If you know the font is installed in e.g. Win XP and/or Vista, you might use conditional comments to show the font (and a suitable font-size) to IE6/7 only. Other browsers will then get a backup font.

Probably there's some way to sniff for OS with javascript too, but I don't know how reliable it will be since browsers often spoof their identity. See e.g. http://www.quirksmode.org/js/detect.html (But like he writes himself, "If you're new to JavaScript, don't use this script.")
User is offlinePM
Go to the top of the page
Toggle Multi-post QuotingQuote Post

2 Pages V  1 2 >
Reply to this topicStart new topic
1 User(s) are reading this topic (1 Guests and 0 Anonymous Users)
0 Members:

 



- Lo-Fi Version Time is now: 24th April 2024 - 03:53 AM