SitePoint Sponsor |
|
User Tag List
Results 1 to 20 of 20
Thread: Text size
-
Aug 6, 2001, 14:56 #1
- Join Date
- Nov 2000
- Location
- New York
- Posts
- 765
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Text size
I was wondering if anyone could help me..
I am making a site and I want the font size to be exactly 10pt, and to not be effected by what setting the user chose in their browser (largest to smallest). I know when I do size="2" that is effected by the users choice, but I thouhgt if I used css it would not be? Only links appear to be staying at the size I chose.
Thanks a lot anyone.
-
Aug 6, 2001, 15:12 #2
body { font-family : arial, sans serif ; font-size : 10pt ; }
td { font-family : arial, sans serif ; font-size : 10pt ; } // at least if you're using tables
-
Aug 6, 2001, 15:16 #3
- Join Date
- Nov 2000
- Location
- New York
- Posts
- 765
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Wow
I posted one dumb question, but you answered it perfectly
It even solved problems I hadn't addressed yet
thanks a lot
-
Aug 6, 2001, 15:37 #4
-
Aug 7, 2001, 20:51 #5
- Join Date
- May 2001
- Location
- View Ridge
- Posts
- 692
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Specifying the font attributes using the body element has caused me some grief in the past. Better to specify the font attributes for the individual elements:
li,p,td
{
font-family: foo;
font-size: 10pt;
}
-
Aug 7, 2001, 20:55 #6
- Join Date
- Jun 2001
- Location
- Oklahoma
- Posts
- 3,392
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
You can still change it in a browser, even using CSS and points.
To keep users from changing it you need to use "px" instead of "pt" in your CSS.Colin Anderson
Ambition is a poor excuse for those without
sense enough to be lazy.
-
Aug 7, 2001, 21:36 #7
- Join Date
- Apr 2001
- Location
- San Francisco
- Posts
- 3,288
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Actually, I've found that the BEST way to use CSS is by using all classes. Example:
[css]
.sidebar { font-size: 10pt ; color: #FFFFFF ; font-family: verdana ; }
.content { font-size: 12pt ; color: #000000 ; font-family: verdana ; }
[/css]
Therefore, you can use the class in any HTML tag that it can be used in. Example:
Code:<td class="sidebar"> Home <br>About Us <br>Contact </td> <td><ul class="content"> <li>blah <li>blah <li>blah</ul> </td>
http://www.mostlyamphigory.com/navbar/vn1style.css
I learned a lot from his stylesheet.SPF Mentor/Advisor 2001-2003
SPF Designer of the Year 2002
SPF Graphic Designer of the Year 2003
AdamPolselli.com
-
Aug 8, 2001, 08:32 #8
- Join Date
- Oct 2000
- Location
- Nashvegas Baby!
- Posts
- 7,845
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Adam...that's not the best way actually. Classes are good, but you duplicate code when you define font faces and sizes for each class.
Ideally, if consistency of font faces and sizes are your desire, set every block level element right off like so:
body, td, p, div, li (and more) {font-family: verdana; font-size: 10px; }
Then you change the sizes and faces from there using classes. Doing it this way makes it a snap to change sizes and faces all over your site. You just change the body tag declaration and presto. If you define it using classes you have to change it multiple times. That defeats the whole purpose of stylesheets.
-------------------------------------
Now, to address Marc's comment about setting the body font so that someone can't change the size.
FOR THE LOVE OF GOD DON'T DO THAT!!
That is bad design of the highest order. YOu are in effect telling your users that you don't care about their opinion. Remember, you are making a website for THEM right? Let me address a few common statements that designers make when they say they want to use pixels
-= If the user resizes the text, then my site will break.
A. Then your site is designed poorly to begin with.
-= I want the text size to be IDENTICAL in Netscape and IE on a MAc and PC.
A. It will NEVER happen, so why trouble yourself and piss off your users. You can't even get an IMAGE to be the same size with all 4 of those variables. How can you expect text to be the same?
Browsers have BUILT IN functionality to allow a user (one who might have poor eyesight, or a crappy monitor) to resize the text to THEIR liking. The way I look at it, when you start taking away that functionality you start making people angry. You don't want to make your users angry at you do you?
If you do your site layout properly, then a user can resize your site all they want to and it should not break. Even if it does, the user will understand that THEY are the ones who did that and not you.Adobe Certified Coldfusion MX 7 Developer
Adobe Certified Advanced Coldfusion MX Developer
My Blog (new) | My Family | My Freelance | My Recipes
-
Aug 8, 2001, 08:38 #9
- Join Date
- Apr 2001
- Location
- San Francisco
- Posts
- 3,288
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Adam...that's not the best way actually. Classes are good, but you duplicate code when you define font faces and sizes for each class.
::mumbles to self::
i'm so stupid, stupid, stupid...SPF Mentor/Advisor 2001-2003
SPF Designer of the Year 2002
SPF Graphic Designer of the Year 2003
AdamPolselli.com
-
Aug 8, 2001, 09:41 #10
- Join Date
- Oct 2000
- Location
- Nashvegas Baby!
- Posts
- 7,845
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
no no no...
it's just thinking ahead, that's all. Besides, the code you posted was good. Just not the best way. You should know by now that there are always several ways to accomplish something in web design. Some are more efficient is all.Adobe Certified Coldfusion MX 7 Developer
Adobe Certified Advanced Coldfusion MX Developer
My Blog (new) | My Family | My Freelance | My Recipes
-
Aug 8, 2001, 09:49 #11
- Join Date
- Apr 2001
- Location
- San Francisco
- Posts
- 3,288
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
haha, thanks for the uplift creole
SPF Mentor/Advisor 2001-2003
SPF Designer of the Year 2002
SPF Graphic Designer of the Year 2003
AdamPolselli.com
-
Sep 19, 2001, 02:50 #12
- Join Date
- Feb 2001
- Location
- Melbourne Australia
- Posts
- 6,282
- Mentioned
- 1 Post(s)
- Tagged
- 0 Thread(s)
Originally posted by swimm5001
A good example stylesheet is mmj's at mostlyamphigory.com:
http://www.mostlyamphigory.com/navbar/vn1style.css
I learned a lot from his stylesheet.
The truth is, my stylesheet isn't the best example. It has its problems, and these are the same problems that all stylesheets have.
I use % values for the text (just like em really). This is great. Users of netscape and IE can resize their text to their liking, and it looks great.
The nightmare starts when I see my site on netscape on a mac. Anything under 10pt is now so small that I cannot see a thing! It is just a line of pixels. As it turns out, 12pt on a mac uses only 75% the size as 12pt on an average PC. It is the same for all point sizes.
However, after eliminating everything under 10pt, by increasing it to 10pt, there is no way of having small text on a PC. 10pt is quite large on a PC.
It is turning into a nightmare. It turns out that sitepoint.com uses a different stylesheet for mac as for PC. You may not realise it (unless you view the stylesheet on both a mac and PC) but the stylesheet is different. Font sizes are generally 33% larger on the mac stylesheets to compensate for the differences.
I don't want to switch to fixed font sizes (pt or px) but I don't want my site unreadable on a mac! Yikes...
By the way, I am editing my stylesheet this week, so it might change a bit.[mmj] My magic jigsaw
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
The Bit Depth Blog · Twitter · Contact me
Neon Javascript Framework · Jokes · Android stuff
-
Sep 19, 2001, 09:26 #13
- Join Date
- Jun 2001
- Location
- Madrid, Spain
- Posts
- 24
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
I don't think Creole is right. I always use pixels for the type, because of some different interpretations in what is a 'point' between PC & Mac.
Using pixels is not a fault: the CSS standard defines several units of measure, and pixels is one of them. Yes, we may be used to points in non web related jobs, but using pixels is very easy and much more useful. 11px is the modern little type you see everywhere, 12px is more legible.
And for the discussion on using classes for specifying the text size, it should be ok to put it only in the body tag, but several browsers have problems with the 'cascading' part of CSS, so they would break the font style when reaching a <TD>.
So, just adding:
body, td, td p {
font-family: Verdana, Geneva, Arial, Helvetica, sans-serif;
font-size: 12px;
line-height: 18px;
}
(Using line-height with NS4 is not recommended, but...)
Should work. Anyway, my philosophy is to forget about NS4, specially since we have the much better NS6, Opera, Konqueror, IE5/Mac...
User font-resizing is not a matter of the web designer, but of the browser manufacturer. Opera5 and IE5/Mac already have got the Zoom feature, which is what eventually every browser will have.
If you're interested in the point vs. pixels matter, I'll give you some links where you can find the technical explanation, from Zeldman, AListApart and Code*****.Carlos de la Orden
The higher a man gets, the smaller he looks for people who can't fly.
www.aspfacil.com, el sitio para programadores ASP
-
Sep 23, 2001, 14:19 #14
- Join Date
- Sep 2001
- Location
- Maryland
- Posts
- 112
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Wow! This is the best thread i've run across yet. When I designed my site I used pt with no CSS. After getting complaints for customers and resizing one page at a time (60 in all
) using CSS and em and ran into similar problems on the different OS's. I have now converted all text to px and get a consistant look no matter the browser or platform.
Printing is a problem with px tho so I'm in the process of making "printable" pages of certain sections of my site.
I us a Mac btw
-
Sep 24, 2001, 02:20 #15
wrkalot i am just curious what problems you enountered using the em unit. I am still trying to learn CSS and the book I'm using recommends using the em unit above anything else.
-
Sep 24, 2001, 07:36 #16
- Join Date
- Sep 2001
- Location
- Maryland
- Posts
- 112
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
Well, I'm no expert thats for sure but if I remember correctly em acted like pt did. The text in Netscrape was much smaller than IE.
It could very well have been poor coding on my part but since converting to px all has been well.
Some of the previous post attempt to clarify these issues but I too am a bit confused as to the best method.
-
Sep 24, 2001, 18:01 #17
- Join Date
- Apr 2001
- Location
- Seattle
- Posts
- 281
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
cyberprince, you may want to check out this link: http://www.richinstyle.com/masterclass/lengths.html
-
Sep 25, 2001, 09:23 #18
thanks OneChance. just printed that Article out for some reading.
-
Sep 25, 2001, 09:41 #19
- Join Date
- Oct 2000
- Location
- Nashvegas Baby!
- Posts
- 7,845
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
MOS (and others)
There are times when PX is an acceptable unit of measurement (accent text, buttons etc...), however (IMO) it should NEVER be used for body type. The reason? It takes away control from the user, you know...that person you designed the site for in the first place?
When possible you should ALWAYS design for the widest range of people. That includes people who have trouble with their eyes. Setting a font to PX effectively removes the users ability to increase the size of the text, which means that they might just leave your site?
Besides...is it REALLY that important that a font is EXACTLY the same size in all browsers? The way I look at it, if your site breaks in different browsers just because of font size, then something is wrong with your site's structure.Adobe Certified Coldfusion MX 7 Developer
Adobe Certified Advanced Coldfusion MX Developer
My Blog (new) | My Family | My Freelance | My Recipes
-
Sep 25, 2001, 17:33 #20
- Join Date
- Nov 2000
- Location
- New York
- Posts
- 765
- Mentioned
- 0 Post(s)
- Tagged
- 0 Thread(s)
So, creole, when you set your text size, you use the standard html "2" for most content?
I think you are right about not using absolute values for text sizes, but that is just another variable that we designers have to deal with and makes producing a nice looking website that much harder
And you use "medium" size when viewing your site and others, I assume?
I wonder if there's anywhere one could find reliable statistics on what setting most people use, from smallest to largest, and since netscape just goes by increments, do you know how many different sizes it has?
Bookmarks