SitePoint Sponsor

User Tag List

Results 1 to 5 of 5
  1. #1
    SitePoint Guru
    Join Date
    Nov 2008
    Posts
    622
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)

    strange image size

    hi all

    my image is 1500px wide but i want to show it 100% acording to screen resolution.

    the image is getting fitted at 100% screen in all browsers except IE.

    IE stretches it to 1500px wide but other browsers dont stretch it.

    so how can IE also adjust it acording to screen resolution.

    vineet

    Code:
    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
    <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
    <title>Untitled Document</title>
    </head>
    
    <body><table width="100%" border="0" cellspacing="0" cellpadding="0">
      <tr>
        <td style="width:100%;">
    <a href=""><img src="image.gif" style="width:100%;"/> </a></td>
      </tr>
    </table>
    
    </body>
    </html>

  2. #2
    SitePoint Evangelist stonedeft's Avatar
    Join Date
    Aug 2009
    Posts
    589
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    Well as an alternative you can use it as a background image instead:

    <style>
    td{
    background-image:url(myimage.gif);
    background-position:center top;
    background-repeat:no-repeat;
    width:100%;
    height:100% /*or define your height*/
    }
    </style>

    cheers
    Don't Panic

  3. #3
    SitePoint Guru
    Join Date
    Nov 2008
    Posts
    622
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    hi stone

    if i use it as background image then the image gets crop.

    i want it to get fit 100&#37; acroding to screen.

    vineet

  4. #4
    SitePoint Evangelist stonedeft's Avatar
    Join Date
    Aug 2009
    Posts
    589
    Mentioned
    0 Post(s)
    Tagged
    0 Thread(s)
    oops sorry evidently I misunderstood your post, You are using tables w/c is meant for tabular data I think IE is taking the relative width of the table will you try using div's instead and tell us what happens:

    css:

    #content{
    width:100%
    }

    .stretch{
    width:100%
    }

    html

    <div id="content">
    <img src="myimage.gif" class="stretch">
    </div>
    Don't Panic

  5. #5
    SitePoint Guru
    Join Date
    Nov 2008
    Posts
    622
    Mentioned
    1 Post(s)
    Tagged
    0 Thread(s)
    hi stone

    thanks. it works with <div>

    vineet


Bookmarks

Posting Permissions

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