SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Addict
    Join Date
    Dec 2001
    Location
    Vancouver, Canada
    Posts
    352
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)

    using CSS to put an H1 title on the same line as text

    hi,

    if I want to use CSS so as to format the following text...

    Hello everyone, and welcome to our site. I would like to bla bla bla....

    I want to put the bolded part in <h1> tags and continue with the rest of the text with regular text. I know already how to format the size of the h1 and know how to use the margin-bottom: 0. but I don't know how to make everything fit in one line.

    Can this be done?

    Sheriff

  2. #2
    SitePoint Wizard iTec's Avatar
    Join Date
    May 2001
    Location
    Sydney, Australia
    Posts
    2,243
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    h1 {display: inline;} should do the trick

  3. #3
    Robert Wellock silver trophybronze trophy xhtmlcoder's Avatar
    Join Date
    Apr 2002
    Location
    A Maze of Twisty Little Passages
    Posts
    6,316
    Mentioned
    60 Post(s)
    Tagged
    0 Thread(s)
    It interests me why you'd use a header inline to begin a block of text, when it doesn't appear to be used as either a heading or subheading from the text sample you gave.
    Last edited by xhtmlcoder; Jan 28, 2003 at 13:29.

  4. #4
    ☆★☆★ silver trophy vgarcia's Avatar
    Join Date
    Jan 2002
    Location
    in transition
    Posts
    21,235
    Mentioned
    1 Post(s)
    Tagged
    1 Thread(s)
    Why an h1 tag? Why not do something like this:

    CSS
    Code:
    p {
     font-size: 10pt;
    }
    .bigger {
     font-size: 16pt;
    }
    HTML:
    Code:
    <p><span class="bigger">Hello Everyone,</span> and welcome to our site...</p>
    Or if you want to use CSS2 (not widely supported yet), you can try this:

    CSS:
    Code:
    p:first-line {
     font-size: 16pt;
    }
    p {
     font-size: 10pt;
    }
    HTML:
    Code:
    <p>The first line of this paragraph should be much larger
    than any line following it. This method of CSS classification is not widely supported in browsers yet though.</p>

  5. #5
    SitePoint Addict
    Join Date
    Dec 2001
    Location
    Vancouver, Canada
    Posts
    352
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Hi all,

    And thanks for the help. Itec, your code worked perfectly.

    I guess I owe a little explanation. I am a search engine consultant. I have a client that does not want to put a title on top of his body text and wants to keep everything small.

    While keyword density isn't as important for search engines anymore, Google still put some importance on <h1> tags to determine relevancy. I realize that Google puts more importance on the keywords used in inbound links, but the H1 tags are still playing a role in search engine optimization. This client is targeting a very competitive field so I want to optimize his site as much as possible without spamming the search engines or do something that Google would frown upon.

    So the first two words on his body text is actually his main key phrase, so I will put these two first words within an h1 tag and format the h1 tag to look like a regular text.


    I hope this clarifies why I've asked this question.

    Take care,

    Sheriff


Bookmarks

Posting Permissions

  • You may not post new threads
  • You may not post replies
  • You may not post attachments
  • You may not edit your posts
  •