Forums

daydreemer

How can you write a line of text with the first 2 words bold and the rest of the words in the line normal.

I tried wrapping the first 2 words in a h1 tag and the rest in h2, but the h2 part gets pushed down to another line when previewed.
e.g.
<h1>First words</h1><h2>the rest of the sentence</h2>

Thanks, Steve

jim

<body>
<strong>hey</strong> hey
</body>

Maybe?

brianatlarge

The h2 elements get pushed down because h1, h2, etc are block elements instead of inline elements.

You may want to put all of your text in the h1 element, and then the part you want to be bigger in a span element.

ie:

<h1><span>This is bigger</span>than this text</h1>

Then in your css you could assign a class to that text, or just style all the span elements

span {font-size:25px;}

EDIT:

Yeah, just re-read your post. If you want to bold your stuff, it would probably look like this:

<h1><b>Bold text</b> is fun</h1>

chriscoyier

Yep Brian is right, I just would recommend strong tags instead of the deprecated b tags:

<h1><strong>first words</strong> rest of sentence</h1>

cybershot

couldn't you use the disply:inline property to fix this?

<div id="heading">
<h1>first words</h1> <h2>Second words</h2>
</div>

then in the stylesheet do

#heading h1, h2 { display: inline; }

daydreemer

The strong tags didn't work. No idea why. This is what ended up working OK:

<h1 style="display:inline;">Bold text goes here</h1> <h2 style="display:inline;">normal text goes here</h2>

Steve

box

Only use H tags if the text you are displaying is supposed to be classed as a header. If it is a header, then

<h1>bold text <span style=\"font-weight:normal;\">this is non-bold</span><h1>

Of course you wouldn't use inline styling - but for purposes of illustration I have done so here.

If it isn't actually a header, then simply use <strong> tags as mentioned previously.

treehouse : what would you like to learn today?

Forums

h1 and h2 tags on same line