kristijoy81
kristijoy81

Reputation: 33

Super basic HTML/CSS formatting

I am working on an assignment while teaching myself to code.

p.important {
  font-size: 1.5em;
  font-weight: 900;
}
<p class="important">Warning: We have no slow lorises here.</p>

This is supposed to change the font size to 150% and bold...but it's not working. Everything else in my code is running the way I want. But I can't get this to work. Am I missing something?

Upvotes: 0

Views: 99

Answers (3)

ablanca4
ablanca4

Reputation: 21

What is it showing? Your code looks correct. Is your style definition inside the head of the html? make sure it looks like this

<head>
    <style>
        p.important {
          font-size: 1.5em;
          font-weight: 900;
        }
    </style>
</head>
<body>
  <p class="important">Warning: We have no slow lorises here.</p>
</body>

Upvotes: 1

ntgCleaner
ntgCleaner

Reputation: 5985

If you haven't already - you probably need to specify your starting font-size.

When you start a new CSS, you should probably set your body and html to have font-size:100%;. This will ensure that all of your text will be 16px starting off. Then, when you want your text to be 32px, just set the element's font-size to 2em;

body, html {
    font-size:100%; //Sets default font size to 16px;
}
p.important {
    font-size:1.5em; //Is relative from the closest parent with a font-size 1.5*16 = 24px
}

Upvotes: 1

Anthony Rutledge
Anthony Rutledge

Reputation: 7564

font-weight: bold;

You could try that. Remember, just calling the class p.important will not make it override an inherited class/id with a higher score.

You might try ...

p.important {
  font-size: 1.5em !important;
  font-weight: 900 !important;
}

... to see if you can get it to work at all.

Upvotes: 0

Related Questions