Align text at top of page

Discussion in 'CSS' started by anmldr, Jan 28, 2009.

  1. #1
    I have a background image at the top of a page that repeats for the full width of the page.

    I want to center text over the image both vertically and horizontally.

    The height of the image is 44px with a 1px border. The font size is 22px.

    text-align:center; does not seem to horizontally center the text.

    What am I doing wrong? Do I have to specify the page width in the #pagetitle ?

    Linda
     
    anmldr, Jan 28, 2009 IP
  2. eric.r

    eric.r Peon

    Messages:
    124
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #2
    Yet again..please post a link to the site...posting the css for one div won't do us anything without a page that we can refer to. In the future always start out by posting a link please. Thank you.

    Man what is with people not posting links and just saying "fix this"? Do they not realize we are not psychics?

    ~eric
     
    eric.r, Jan 28, 2009 IP
  3. anmldr

    anmldr Peon

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #3
    There is no site to post a link to or I would have done so. It was what I thought was a complete description of what I am trying to learn how to accomplish. If not, I apologize. Most forums want you to be as concise but as complete as possible. I narrowed down the style to the problem area and described what I am trying to accomplish.

    If it is not enough information, what other than a link did the post lack?

    Thank you,
    Linda
     
    anmldr, Jan 28, 2009 IP
  4. eric.r

    eric.r Peon

    Messages:
    124
    Likes Received:
    3
    Best Answers:
    0
    Trophy Points:
    0
    #4
    Can you screenshot?

    ~eric
     
    eric.r, Jan 29, 2009 IP
  5. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #5
    Also the HTML. I see that you have something, I dunno what, with an id, and absolutely positioned.

    Usually text-align: center needs to go on the parent holding the inline whatever-it-is that you want centered.

    Know also that absolutes shrink-wrap their widths to the content (like floats do) and apparently there are no hard rules on whether a browser may set the width based on any single anonymous inline box (a single, widest word in a bunch of text) or if it must try to keep the whole line of inlines unbroken. Most browsers wrap at some point, but if you don't state a width, they get to guess when that happens.

    In any case, all the relevant HTML (the containers involved at the least, the whole top area if possible, and the CSS for those elements too... position: absolute means you'd better have a positioned ancestor somewheres too... and who's holding the bg image you speak of?).

    Lawlz, writing something for Safari? : ) I will be using this once most others catch up-- it looks very nice on the few who can see it.
     
    Stomme poes, Jan 30, 2009 IP
  6. anmldr

    anmldr Peon

    Messages:
    3
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #6
    It is for mobile Safari on the iPhone. There are some really fun things that are implemented with CSS3 on the iPhone.

    Thanks anyway guys. I figured it out.

    Linda
     
    anmldr, Jan 30, 2009 IP
  7. Stomme poes

    Stomme poes Peon

    Messages:
    3,195
    Likes Received:
    136
    Best Answers:
    0
    Trophy Points:
    0
    #7
    Cool, you get to ignore our favourite browser (IE6) : )

    If it wasn't some typo, pls post what you found-- so this thread can be a reference to someone else.
     
    Stomme poes, Jan 30, 2009 IP