Restricting inline image size

Collapse
This topic is closed.
X
X
 
  • Time
  • Show
Clear All
new posts
  • no-spam@no-spam.com

    Restricting inline image size

    Hello,

    I have an HTML question that I'm not sure can be solved. I want to
    restrict the maximum size of an inline image.

    For example, I can force the image to be 200x200 if I do this:
    <img src=blah.gif width=200 height=200>

    But, that messes up the aspect ratio, and could size the image larger than
    it's original size.

    What I want is a way to size an image such that it's aspect ratio is
    preserved and the image is less than the given size (let's say 200x200 for
    now).

    I've tried placing the image in a table cell, and setting the table cell
    size to 200x200, but that doesn't work as the image displays in full size
    (stretching the table cell beyond that I specified)

    Yes, I know I can do this by manually resizing the image, or fetching the
    dimensions of the image and calculating a size myself. But, I am
    specifically looking for a way to do it with an inlime image without
    fetching it first.

    Thanks

    -----------------------------------------------------------[color=blue]
    > Posted using QuadSucker/News, http://www.quadsucker.com
    > ... the ultimate tool for newsgroup downloading![/color]
    -----------------------------------------------------------
  • Spartanicus

    #2
    Re: Restricting inline image size

    no-spam@no-spam.com wrote:
    [color=blue]
    >Yes, I know I can do this by manually resizing the image, or fetching the
    >dimensions of the image and calculating a size myself. But, I am
    >specifically looking for a way to do it with an inlime image without
    >fetching it first.[/color]

    Sounds like you are doing inappropriate things with that image, explain
    the context.

    --
    Spartanicus

    Comment

    • jake

      #3
      Re: Restricting inline image size

      In message <114j5m4ennivd6 4@news.supernew s.com>, no-spam@no-spam.com
      writes[color=blue]
      >Hello,
      >
      >I have an HTML question that I'm not sure can be solved. I want to
      >restrict the maximum size of an inline image.
      >
      >For example, I can force the image to be 200x200 if I do this:
      ><img src=blah.gif width=200 height=200>
      >
      >But, that messes up the aspect ratio, and could size the image larger than
      >it's original size.
      >
      >What I want is a way to size an image such that it's aspect ratio is
      >preserved and the image is less than the given size (let's say 200x200 for
      >now).
      >
      >I've tried placing the image in a table cell, and setting the table cell
      >size to 200x200, but that doesn't work as the image displays in full size
      >(stretching the table cell beyond that I specified)
      >
      >Yes, I know I can do this by manually resizing the image, or fetching the
      >dimensions of the image and calculating a size myself. But, I am
      >specifically looking for a way to do it with an inlime image without
      >fetching it first.
      >
      >Thanks
      >
      >-----------------------------------------------------------[color=green]
      >> Posted using QuadSucker/News, http://www.quadsucker.com
      >> ... the ultimate tool for newsgroup downloading![/color]
      >-----------------------------------------------------------[/color]

      (a) Place the image in a containing DIV which you set to the appropriate
      width (say 200px).

      (b) Then set the <img> size as: width="100%'

      That will cause the browser to resize the image and display it as 200px
      wide.

      Depending on what you are trying to do, resizing the image in an image
      editor beforehand is usually the best approach.

      What are you trying to do?

      regards.
      --
      Jake

      Comment

      • Stan Brown

        #4
        Re: Restricting inline image size

        "" wrote in comp.infosystem s.www.authoring.html:[color=blue]
        >What I want is a way to size an image such that it's aspect ratio is
        >preserved and the image is less than the given size (let's say 200x200 for
        >now).[/color]

        Then you want an image processor, such as the free Irfanview (if
        you're on Windows, which I imagine you are):


        Do not, repeat not, resize images in HTML. First, mst browsers do a
        poorer job than most image processors. Second, it's pretty silly to
        download a big image and then display it as a small image.

        --

        Stan Brown, Oak Road Systems, Tompkins County, New York, USA
        Dragon222 adalah situs slot gacor terbaru yang selalu memberikan banyak bonus menarik dan kemenangan JP untuk pemain setia selama bermain di link slot DRAGON222.

        Comment

        • Hamster_Huey
          New Member
          • Aug 2005
          • 3

          #5
          Originally posted by jake
          In message <114j5m4ennivd6 4@news.supernew s.com>, no-spam@no-spam.com
          writes[color=blue]
          >Hello,
          >
          >I have an HTML question that I'm not sure can be solved. I want to
          >restrict the maximum size of an inline image.
          >
          >For example, I can force the image to be 200x200 if I do this:
          ><img src=blah.gif width=200 height=200>
          >
          >But, that messes up the aspect ratio, and could size the image larger than
          >it's original size.
          >
          >What I want is a way to size an image such that it's aspect ratio is
          >preserved and the image is less than the given size (let's say 200x200 for
          >now).
          >
          >I've tried placing the image in a table cell, and setting the table cell
          >size to 200x200, but that doesn't work as the image displays in full size
          >(stretching the table cell beyond that I specified)
          >
          >Yes, I know I can do this by manually resizing the image, or fetching the
          >dimensions of the image and calculating a size myself. But, I am
          >specifically looking for a way to do it with an inlime image without
          >fetching it first.
          >
          >Thanks
          >
          >-----------------------------------------------------------[color=green]
          >> Posted using QuadSucker/News, http://www.quadsucker.com
          >> ... the ultimate tool for newsgroup downloading![/color]
          >-----------------------------------------------------------[/color]

          (a) Place the image in a containing DIV which you set to the appropriate
          width (say 200px).

          (b) Then set the <img> size as: width="100%'

          That will cause the browser to resize the image and display it as 200px
          wide.

          Depending on what you are trying to do, resizing the image in an image
          editor beforehand is usually the best approach.

          What are you trying to do?

          regards.
          --
          Jake
          I've got the exact same problem, and i've seen that solution in practice, however i cant seem to work it to solve my problem. Specifically, im not sure how to change the width attribute properly. I've got a simple page with a 1 row table with 3 columns on it.

          First column = image
          Second column = text
          Third column = blank space

          I want the first and last columns to be equal size and smaller than the middle column of text. How do i adjust the width of the cell containing the image then to make this work? Do the widths of all the columns have to add up to anything??

          Thanks in advance for any help,
          Sev

          Comment

          Working...