Forums

The forums ran from 2008-2020 and are now closed and viewable here as an archive.

Home Forums CSS How do I make the text appear in the middle of the picture?

  • This topic is empty.
Viewing 4 posts - 1 through 4 (of 4 total)
  • Author
    Posts
  • #31464
    chainonwrist
    Member

    Hello all, it’s a little bit too hard for me to explain my problem, so forgive me for the crazy title of this post.

    I’m a newbie to this, and I’m trying to make a web page that looks similar to a picture of what a friend of mine gave to me, with tables, color changes etc. It all goes well until I came to this problem, see the picture The text is kind of floating under the picture and I’m trying to understand how to put text in the middle of the picture so the annoying “j” letter isn’t ruining the view. So far I understand that it has to do with vertical centering? But how do I make it, I’ve tried vertical centering to the top, but I haven’t achieved and so far I’ve only played with vertical centering options but nothing really helps me, maybe I’m not seeing something or maybe I’m putting things in the wrong place? I’m new to this, so a lot of things I’m just trying to guess. I’ve worked with a html and a css file, but I made the css into the html, just for the sake of space.

    Thanks for any kind of replies :)

    
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">




    test




































    ONE TWO THREE FOUR FIVE








































    Tags Pielietojums Komentārs
    <tag> teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts
    <tag> teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts
    <tag> teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts
    <tag> teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts
    <tag> teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts teksts






    #63182
    iancoates
    Member

    how about putting some padding on the text?

    #63183
    hugogmg
    Member

    Hello chainonwrist.
    First you should put cellpadding = 0 and cellspacing = 0 as an attribute to the table tag. This will delete all the gaps between tr’s and td’s

    Second to the tr put the attribute valign=”middle” and the following css rule


    element.style {
    font-size: 13px;
    height: 20px;
    }

    I hope this will do the trick
    Bests,
    Hugo.

    #62801
    chainonwrist
    Member

    Thank you Hugo, it worked :)!

Viewing 4 posts - 1 through 4 (of 4 total)
  • The forum ‘CSS’ is closed to new topics and replies.