Solved

CSS

Posted on 2011-09-08
7
193 Views
Last Modified: 2012-05-12
See attached CSS.

I changed the font size in body to 1.2 em (it was previously 0.95 em).

After doing this, the font size on <h4> changes too.

Why? I want <h4> & all the other <h> to say as they are specified.
style1.css
0
Comment
Question by:Richard Korts
  • 3
  • 3
7 Comments
 
LVL 13

Expert Comment

by:haloexpertsexchange
ID: 36504053
h4s are still a part of the body so anything that you do to the body will affect the h4s.
0
 

Author Comment

by:Richard Korts
ID: 36504087
to haloexpertsexchange:

So the fact that <h4> has it's own font specified does NOT override <body>?

How can I force it to do what I want?

Do I have to put some kind of "container" around the body & specify the font there? Then will <h4>, etc., override that?

Thanks
0
 
LVL 40

Expert Comment

by:gurvinder372
ID: 36504111
Yes, specify a font for h4 to override that
0
VMware Disaster Recovery and Data Protection

In this expert guide, you’ll learn about the components of a Modern Data Center. You will use cases for the value-added capabilities of Veeam®, including combining backup and replication for VMware disaster recovery and using replication for data center migration.

 
LVL 13

Expert Comment

by:haloexpertsexchange
ID: 36504113
it depends on the order that you have them declared in your css file.
if you have h4 declared first and then have the body declared the body will overwrite the css specified for the h4.
Also if you don't have a size declared for the h4 but do have one on the body it will take the one from the body even if you have other font attributes declared for the h4.
0
 

Author Comment

by:Richard Korts
ID: 36504223
To haloexpertsexchange:

Please look at the css file attached to the original posting.

I did not write this css myself, I inherited it.

Note that <body> precedes <h4> and <h4> has it's own font specification (which does not seem to apply).
Maybe I have to use in-line style where I want it?
0
 
LVL 13

Accepted Solution

by:
haloexpertsexchange earned 500 total points
ID: 36504286
I think the reason that all of your fonts are getting bigger is because you are using ems.
http://w3schools.com/cssref/css_units.asp

ems are relative font sizes so if you made your main font size larger it would stand to reason that if the h4 is .9 em of the overall standard font size that if you make the body font size larger you get a larger h4 and any other font-size declarations would also be proportionately larger.

from w3schools       
1em is equal to the current font size. 2em means 2 times the size of the current font. E.g., if an element is displayed with a font of 12 pt, then '2em' is 24 pt. The 'em' is a very useful unit in CSS, since it can adapt automatically to the font that the reader uses
0
 

Author Closing Comment

by:Richard Korts
ID: 36505796
I changed all the em designations to px or pt.

Works perfectly.

Thanks
0

Featured Post

Are your AD admin tools letting you down?

Managing Active Directory can get complicated.  Often, the native tools for managing AD are just not up to the task.  The largest Active Directory installations in the world have relied on one tool to manage their day-to-day administration tasks: Hyena. Start your trial today.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

Suggested Solutions

CSS3 Custom checkboxes This article shows how to style the checkbox form element using only CSS. Works in: Chrome, FF, Safari, Opera, IE9+ Uses modernizr.js to check for :checked pseudo class, falling back to plain old checkboxes (IE8 and bel…
CSS is a visual language used to classify objects and define rules about how they should be displayed. CSS skills aren’t restricted to developers anymore, there is a big benefit to having a basic understanding of the language, regardless of your occ…
In this Micro Tutorial viewers will learn how to create a CSS image sprite (In a later tutorial, viewers will learn how to use CSS and HTML to create a navigation menu using this sprite) Open a new Photoshop document with a width of (Icon width)x(N…
The viewer will learn the benefit of using external CSS files and the relationship between class and ID selectors. Create your external css file by saving it as style.css then set up your style tags: (CODE) Reference the nav tag and set your prop…

803 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question