www.webdeveloper.com
Results 1 to 6 of 6

Thread: How do I put text the same width as the image ontop. Image is 976x300px

  1. #1
    Join Date
    Apr 2012
    Posts
    110

    How do I put text the same width as the image ontop. Image is 976x300px

    Hi, My laptop is 15 inches wide. The image is 976x300px. Its a graphics image I designed.
    The problem is, I cant get the text underneath exactly the same width. The text goes too much to the right.

    I put the background image with {position:absolute;left:130px;} That seemed to move it to the middle.
    Tried the background-position:center. But that just kept the image to the left.
    The image is more or less in the center of the screen now,

    I tried p{color:gold;font-size:x-large; font-family: Arial, Helvetica,sans-serif, text-align:center; font-weight: 700;}

    The text is fine, but it goes too much to the right.

  2. #2
    Join Date
    Jan 2004
    Location
    chertsey, a small town s.w. of london, england.
    Posts
    1,467
    Hi there wildguy2,

    give us the image and the text and we will give you the appropriate code.

    coothead

  3. #3
    Join Date
    Sep 2006
    Location
    new york
    Posts
    266

    Centering things

    I would center the elements.
    SEE FOR EXAMPLE;
    http://www.w3.org/Style/Examples/007....en.html#block
    http://webdesign.about.com/od/beginn...a/aa012207.htm
    [note, image should be display:block; to use margin: 0 auto;]

  4. #4
    Join Date
    Apr 2012
    Posts
    110

    Thanks-solved, put width:850px in P{ }

    Hi, thanks, solved. PUt width in the paragraph.

  5. #5
    Join Date
    Sep 2012
    Posts
    2
    Very glad to meet everybody here,I am just a new member of this forum,I want to make more friends here,I hope you can like me.
    ____________________________________
    share love,share happy,share useful information about http://www.mmolive.com/ and http://www.mmohome.com

  6. #6
    Join Date
    May 2005
    Location
    Gold Coast (MS)
    Posts
    2,216
    Quote Originally Posted by wildguy2 View Post
    Hi, My laptop is 15 inches wide. The image is 976x300px. Its a graphics image I designed.
    The problem is, I cant get the text underneath exactly the same width. The text goes too much to the right.

    I put the background image with {position:absolute;left:130px;} That seemed to move it to the middle.
    Tried the background-position:center. But that just kept the image to the left.
    The image is more or less in the center of the screen now,

    I tried p{color:gold;font-size:x-large; font-family: Arial, Helvetica,sans-serif, text-align:center; font-weight: 700;}

    The text is fine, but it goes too much to the right.
    There are also some nice CSS rules for word spacing and letter spacing should you ever need to use them.

Thread Information

Users Browsing this Thread

There are currently 1 users browsing this thread. (0 members and 1 guests)

Posting Permissions

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



Recent Articles