Go Back   CodingForums.com > :: Client side development > HTML & CSS

Before you post, read our: Rules & Posting Guidelines

Reply
 
Thread Tools Rate Thread
Enjoy an ad free experience by logging in. Not a member yet? Register.
Old 01-19-2013, 05:00 PM   PM User | #1
charlyanderson
Regular Coder

 
Join Date: Dec 2012
Posts: 111
Thanks: 14
Thanked 1 Time in 1 Post
charlyanderson is an unknown quantity at this point
Getting fonts to suit all resolutions

Hi,

I am just finishing off my website and would like to make the font smaller for smallers resolutions only. If not the font just looks a little big

I was going to use media queries but discovered this does not work in IE8, can someone recommend another solution?
charlyanderson is offline   Reply With Quote
Old 01-19-2013, 06:10 PM   PM User | #2
Excavator
Master Coder


 
Excavator's Avatar
 
Join Date: Dec 2006
Location: Alaska
Posts: 9,410
Thanks: 22
Thanked 1,765 Times in 1,749 Posts
Excavator has a spectacular aura aboutExcavator has a spectacular aura aboutExcavator has a spectacular aura about
Hello charlyanderson,
Not sure this will be flexible enough for you but I usually put something like this to establish a base size -
Code:
html, body {
	margin: 0;
	font: 100% "Trebuchet MS", Arial, Helvetica, sans-serif;
	color: #000;
	background: #fc6;
}
And then declare an em size for whatever text I'm using -
Code:
#container {
	width: 800px;
	margin: 0 auto;
	font-size: .75em;
	background: #999;
}
h1 {font-size: 1em;}
http://www.alistapart.com/articles/howtosizetextincss/
__________________
Validate often DURING development - Use it like a splelchecker | Debug during Development |Write it for FireFox, ignore IE
Use the right DocType | Validate your markup | Validate your CSS | Why validating is good | Why tables are bad
Excavator is offline   Reply With Quote
Users who have thanked Excavator for this post:
charlyanderson (01-19-2013)
Old 01-19-2013, 06:14 PM   PM User | #3
charlyanderson
Regular Coder

 
Join Date: Dec 2012
Posts: 111
Thanks: 14
Thanked 1 Time in 1 Post
charlyanderson is an unknown quantity at this point
I'll live it a go thank you. Just trying to get the fonts at a suitable size across the browsers. All this is just developing my hate for IE lol
charlyanderson is offline   Reply With Quote
Old 01-19-2013, 06:26 PM   PM User | #4
Frankie
Regular Coder

 
Join Date: Sep 2011
Posts: 286
Thanks: 3
Thanked 33 Times in 33 Posts
Frankie is an unknown quantity at this point
Quote:
Originally Posted by charlyanderson View Post
Hi,
I am just finishing off my website and would like to make the font smaller for smallers resolutions only. If not the font just looks a little big
I was going to use media queries but discovered this does not work in IE8, can someone recommend another solution?
You might want to reconsider that, because people with a small resolution are used to big fonts. Or they have set the font rendering size of their browser to small(er). If you set a smaller font size as well, it will be too small.
__________________
Frank

How to: Target IE in, Position in, Center in, Create a Fixed ('Sticky') Footer with, and Create a Drop-Down/Fly-Out Menu with CSS: Website Laten Maken Amsterdam.
Frankie is offline   Reply With Quote
Old 01-19-2013, 07:32 PM   PM User | #5
charlyanderson
Regular Coder

 
Join Date: Dec 2012
Posts: 111
Thanks: 14
Thanked 1 Time in 1 Post
charlyanderson is an unknown quantity at this point
I am quite tempted Frankie, just didn't wanna seem unproffessional
charlyanderson is offline   Reply With Quote
Old 01-19-2013, 07:58 PM   PM User | #6
COBOLdinosaur
Regular Coder

 
COBOLdinosaur's Avatar
 
Join Date: Jul 2002
Location: Canada
Posts: 293
Thanks: 0
Thanked 18 Times in 18 Posts
COBOLdinosaur is an unknown quantity at this point
Please do not try to control fonts. This is a user setting, and they know much better than you do what is appropriate for their situation. For accessibility NEVER set an absolute value for font size. Where you need bigger or smaller than the standard font size the user has set for most of the page specify a percentage value which will retain relative sizing without impinging on the users right to set whatever font size they are comfortable with.

Cd&
__________________
100% standards compliant code is 100% correct 100% of the time.
one of my toys from my repository and perhaps some help getting help

Cd&
COBOLdinosaur is offline   Reply With Quote
Old 01-19-2013, 09:14 PM   PM User | #7
Frankie
Regular Coder

 
Join Date: Sep 2011
Posts: 286
Thanks: 3
Thanked 33 Times in 33 Posts
Frankie is an unknown quantity at this point
Quote:
Originally Posted by charlyanderson View Post
I am quite tempted Frankie, just didn't wanna seem unproffessional
Your intention was good, but the effect would have been undesirable. Because for those users who have set their browser to a small(er) font rendering, the font would have become too small. And Cd& has some good advice, too, regarding the absolute font size -- don't set that.
__________________
Frank

How to: Target IE in, Position in, Center in, Create a Fixed ('Sticky') Footer with, and Create a Drop-Down/Fly-Out Menu with CSS: Website Laten Maken Amsterdam.
Frankie is offline   Reply With Quote
Old 01-19-2013, 11:04 PM   PM User | #8
charlyanderson
Regular Coder

 
Join Date: Dec 2012
Posts: 111
Thanks: 14
Thanked 1 Time in 1 Post
charlyanderson is an unknown quantity at this point
Ok thanks I really appreciate your comments. I am very new to web design so still a little unsure of things. I have been using a HD screen with a high resolution for my designing so the design and font generally looks bigger on a standard monitor. I was just concerned about it looking too big and unprofessional.

Having said that I am learning about responsive design now so perhaps for my next design I will do that instead. My website address is here. I am hoping that the final piece looks ok after all.

Thanks again for all your comments
charlyanderson is offline   Reply With Quote
Reply

Bookmarks

Jump To Top of Thread


Thread Tools
Rate This Thread
Rate This Thread:

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is On
HTML code is Off

Forum Jump


All times are GMT +1. The time now is 09:13 PM.


Advertisement
Log in to turn off these ads.