Build Your Own Business Website header image

Introduction to HTML for WordPress & Thesis 2.1 Users – Part 17 – Styling Text with a Span Tag

Difficulty Level -

Filed Under Topics - ,

Listed Under Lesson Subjects -

Applies to - ,

Whoops, you've found some premium content!

Watch the opening clip of this video to preview it,
the full video is available to paid members.

To continue our styling here of of button link we could come back over and let’s add that span. Let’s say, span class=”learn-more”, update it and then reload. So you can see how that span class then gets applied to this style.

Now, obviously this isn’t an application that you would use that in but you can see what happens when you apply the span right? The thing that we’ve created is large enough that it overwrites the size of the text itself so it’s sitting on top of the letters and bumping up like that.

If we came along to this thing and said display:block it would completely break this section in two because the block display does that, the block display creates the brand new line essentially so it makes things stack.

We’ll take out height, we’ll take out display:block and save that. Come back over to our span and that span class=”fishsticks” has nothing in it so if we wanted to just do a straight .testimonial .fishsticks color:green.

0 Comments… add one
0 comments… add one