1. Advertising
    y u no do it?

    Advertising (learn more)

    Advertise virtually anything here, with CPM banner ads, CPM email ads and CPC contextual links. You can target relevant areas of the site and show ads based on geographical location of the user if you wish.

    Starts at just $1 per CPM or $0.10 per CPC.

What are my profile pictures disorted?

Discussion in 'HTML & Website Design' started by UCDaZ, May 1, 2009.

  1. #1
    Whenever I display an image, it looks distorted. What is the proper way to display an image?

    My Site

    And I notice a lot of sites out there have a white border around their images. How do they do that?
    example site
     
    UCDaZ, May 1, 2009 IP
  2. olddocks

    olddocks Notable Member

    Messages:
    3,275
    Likes Received:
    165
    Best Answers:
    0
    Trophy Points:
    215
    #2
    just remove the width and height inside img tag.
     
    olddocks, May 1, 2009 IP
  3. UCDaZ

    UCDaZ Active Member

    Messages:
    180
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    53
    #3
    But I need the image to be a certain size.
     
    UCDaZ, May 1, 2009 IP
  4. Masterful

    Masterful Well-Known Member

    Messages:
    1,653
    Likes Received:
    28
    Best Answers:
    0
    Trophy Points:
    140
    #4
    You never adjust the size of an image using the width and height attributes. You must do the adjusting using an image editor (make sure to keep a master copy). The width and height attributes are used only to specify the width and height of the image to browsers.
     
    Masterful, May 1, 2009 IP
  5. outerphilly

    outerphilly Peon

    Messages:
    14
    Likes Received:
    0
    Best Answers:
    0
    Trophy Points:
    0
    #5
    You can use the width and height tags but it will take alot of trial and error to get it to look just right. Using an image editor will make the job much easier .
     
    outerphilly, May 1, 2009 IP
  6. UCDaZ

    UCDaZ Active Member

    Messages:
    180
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    53
    #6
    How would I use an image editor when the images are uploaded by the user?
     
    UCDaZ, May 1, 2009 IP
  7. Kerosene

    Kerosene Alpha & Omega™ Staff

    Messages:
    11,366
    Likes Received:
    575
    Best Answers:
    4
    Trophy Points:
    385
    #7
    CSS. Just add something like this to your img style:
    border:solid 1px #333333; padding:1px;
    Code (markup):

    You can dynamically create resized versions of user uploaded images by using the PHP GD Library:
    http://www.php.net/manual/en/intro.image.php
    http://www.lateralcode.com/manipulating-images-using-the-php-gd-library/
    http://www.libgd.org/Main_Page

    It sounds way more complicated than it is. :)
     
    Kerosene, May 1, 2009 IP
  8. olddocks

    olddocks Notable Member

    Messages:
    3,275
    Likes Received:
    165
    Best Answers:
    0
    Trophy Points:
    215
    #8
    use any php script to resize the image of your desired size. Make sure you maintain aspect ratio. If not it would get distorted.
     
    olddocks, May 1, 2009 IP
  9. UCDaZ

    UCDaZ Active Member

    Messages:
    180
    Likes Received:
    1
    Best Answers:
    0
    Trophy Points:
    53
    #9
    Do I need to create the image thumbnail and save it in a directory, or do most people just generate the display image as a thumbnail on the fly?
     
    UCDaZ, May 15, 2009 IP
  10. olddocks

    olddocks Notable Member

    Messages:
    3,275
    Likes Received:
    165
    Best Answers:
    0
    Trophy Points:
    215
    #10
    the best method is save it on your server and then display it. if you do it on the fly, it will put load on your server cpu usage.

    i always use php thumbnailer class to get the job done..
     
    olddocks, May 15, 2009 IP