Simple CSS Question.

Dalek Dave

I have a Header that in CSS is font-size:xx-large, however I want it to be larger. How do I set a larger font? (Using Visual Web Developer 2008)

.header
{
margin-left:auto;
margin-right:auto;
width:1024px;
height:100px;
background-color:#AAFBF9;
padding-top:5px;
font-size:xx-large;
text-align:center;
}

------------------------------------ I will never again mention that I was the poster of the One Millionth Lounge Post, nor that it was complete drivel. Dalek Dave CCC League Table Link CCC Link[^]

DaveAuld

You could set a point size instead of a named attribute value; e.g. font-size:72px Play here; http://www.w3schools.com/css/tryit.asp?filename=trycss_font-size_px[^] Edit: I meant to link you to this page as well, it shows the different options and details the recommendations (such as the em mentioned by Pete below) http://www.w3schools.com/css/css_font.asp[^]

Dave Find Me On: Web|Facebook|Twitter|LinkedIn CPRepWatcher now available as Packaged Chrome Extension, visit my articles for link.

modified on Monday, October 11, 2010 3:56 PM

Pete OHanlon

You can set a larger size using something like px (pixels). This isn't a great solution however, as it's not very friendly for scalable pages. I would use something like em instead. You can set it to something like font-size:2.2em.

I have CDO, it's OCD with the letters in the right order; just as they ruddy well should be

Forgive your enemies - it messes with their heads

My blog | My articles | MoXAML PowerToys | Onyx

Dalek Dave · modified on Monday, October 11, 2010 3:56 PM

I had tried that, had no fun. EDIT: Sorted! Forgot the PX!

------------------------------------ I will never again mention that I was the poster of the One Millionth Lounge Post, nor that it was complete drivel. Dalek Dave CCC League Table Link CCC Link[^]

modified on Monday, October 11, 2010 4:53 PM

DaveAuld · modified on Monday, October 11, 2010 4:53 PM

Dalek Dave wrote:

Forgot the PX!

:doh:

Dave Find Me On: Web|Facebook|Twitter|LinkedIn CPRepWatcher now available as Packaged Chrome Extension, visit my articles for link.

Jules VDV

I would also suggest setting your body font-size to 62.5%. This way, it is easier to convert between em and px. For example:

body{
font-size: 62.5%;/*1em = 10px*/
}

p{
font-size: 1.2em; /* 1.2em = 12px */
}

Dalek Dave

Thanks, good idea.

------------------------------------ I will never again mention that I was the poster of the One Millionth Lounge Post, nor that it was complete drivel. Dalek Dave CCC League Table Link CCC Link[^]

Lost User

But then, you should also consider using "CSS Reset" such as ... http://yui.yahooapis.com/2.8.2r1/build/reset-fonts-grids/reset-fonts-grids.css[^] or http://meyerweb.com/eric/tools/css/reset/reset.css[^]

Jules VDV

Always a good idea :)