Skip navigation
Currently Being Moderated

Center heading text

May 22, 2013 9:17 AM

Hello,

 

To center text for a heading 1 do you use the <div align="center"> in the code or do you create a css style sheet?  Also, is there a list of codes somewhere that you can reference?  Thanks!

 
Replies
  • Currently Being Moderated
    May 22, 2013 9:27 AM   in reply to Hot Rod Raven

    <div align="center"> is fine in some doctypes, but in html5 it is obsolete. CSS is better...

     

    h1 {

         text-align:center;

    }

     

    http://www.w3schools.com/ is a very good reference for most css and html.

     
    |
    Mark as:
  • Currently Being Moderated
    May 22, 2013 9:46 AM   in reply to Hot Rod Raven

    The align attribute was deprecated in HTML 4.01 onward.

     

    Centering Pages, Images and other elements with CSS

    http://cookbooks.adobe.com/post_Centering_web_pages_and_other_elements _with_CSS-16640.html

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    May 22, 2013 9:54 AM   in reply to Hot Rod Raven

    Placing text within an image is completely ignored by search engines, there is no way for them to see it or do anything with it.

     

    Your page title, or more accurately, the most important text on your page, should be in an <h1> tag set.

     

    Your actual page title is between your <title> tags.

     
    |
    Mark as:
  • Currently Being Moderated
    May 22, 2013 9:57 AM   in reply to Hot Rod Raven

    Images are not "seen" by search engines, language translators or screen readers.  For best recognition, use real text in heading tags. 

     

    Example:

    http://alt-web.com/FluidGrid/Fluid1.html

     

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    May 22, 2013 10:09 AM   in reply to Hot Rod Raven

    Every page should have a unique <title> and at least one <h1> tag with your most important keywords inside it. That's usually your company / site name.

     

    <html>

    <head>

    <title> Unique page title</title>

    </head>

    <body>

    <h1>Site Name</h1>

    <h2>Slogan or sub-title</h2>

     

    <h3>Page heading</h3>

         <p>descriptive text</h3>

     

    <h3>Page heading</h3>

         <p>descriptive text</p>

     

    <h4>Sub-heading</h4>

         <lists>

     

    <h4>Sub-heading</h4>

         <p>details</p>

     

    </body>

    </html>

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    May 22, 2013 10:39 AM   in reply to Hot Rod Raven

    You could do that.

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    May 22, 2013 11:03 AM   in reply to Nancy O.

    But be aware that the alignment of that text with the image will be completely dependent on the visitor's browser's settings for text display. This may not be a good approach as a result.

     
    |
    Mark as:
  • Currently Being Moderated
    May 22, 2013 11:14 AM   in reply to MurraySummers

    Yes.  That's true. I try to leave a lot of wiggle room on all sides.  I also apply a compatible background-color to the div.

     

     

    header {

         background: #000 (some_image.jpg) no-repeat;

         width: xxxpx; /*same as image*/

         min-height: xxxpx; /*same as image*/

    }

     

    header h1 {

         color: #FFF;

         margin: 0;

         padding:0

         text-align:center;

         font-size: 36px;

    }

     

     

    Nancy O.

     
    |
    Mark as:
  • Currently Being Moderated
    May 23, 2013 8:46 AM   in reply to Hot Rod Raven

    <h1> needs to be used somewhere within the <body> tag set.

     

    If you are using html5 and have a <header> tag, it can be used there (since <header> is within the <body>), but the <head> section is reserved for other things, an <h1> between <head> tags would be invalid.

     
    |
    Mark as:

More Like This

  • Retrieving data ...

Bookmarked By (1)

Answers + Points = Status

  • 10 points awarded for Correct Answers
  • 5 points awarded for Helpful Answers
  • 10,000+ points
  • 1,001-10,000 points
  • 501-1,000 points
  • 5-500 points