473,386 Members | 1,726 Online
Bytes | Software Development & Data Engineering Community
Post Job

Home Posts Topics Members FAQ

Join Bytes to post your question to a community of 473,386 software developers and data experts.

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

-----------------------------------------------------------
Posted using QuadSucker/News, http://www.quadsucker.com
... the ultimate tool for newsgroup downloading!

-----------------------------------------------------------
Jul 24 '05 #1
4 16644
no*****@no-spam.com wrote:
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.


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

--
Spartanicus
Jul 24 '05 #2
In message <11*************@news.supernews.com>, no*****@no-spam.com
writes
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

-----------------------------------------------------------
Posted using QuadSucker/News, http://www.quadsucker.com
... the ultimate tool for newsgroup downloading!

-----------------------------------------------------------


(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

Jul 24 '05 #3
"" wrote in comp.infosystems.www.authoring.html:
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).


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

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
http://OakRoadSystems.com/
Jul 24 '05 #4
In message <114j5m4ennivd64@news.supernews.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
Aug 23 '05 #5

This thread has been closed and replies have been disabled. Please start a new discussion.

Similar topics

38
by: Shaun McKinnon | last post by:
HI...Here's my problem...I have a popup window that loads when i want it to, but it's not sized properly. I've set the size, but it doesn't seem to work. I've been on 8 different websites to find...
4
by: Kenny | last post by:
I have been trying to write a script that will increase the size of and image when you mouse over it, and decrease it to original size, when you mouse out. After a couple of attempts, this is what...
7
by: Haines Brown | last post by:
I'm in the practice of specifying img width and height in my style definitions, although I usually use the actual size of the image. I'm reworking the style and it would be convenient to leave...
7
by: Leszek | last post by:
Hello, I need to set dynamically height and width attributes of an image control on a WebForm. I know how to read the whole image from the hard-drive and use its height and width properties. I...
11
by: KarimL | last post by:
Thanks for your advices... but i need to get the Image height because i dynamically resize the height of my webcontrol based on the image height. More i just have the url (relative parth) to the...
0
by: Bill Rowell | last post by:
ASP .NET has a built in limit of the request size (which is configurable) of 4MB. So, if a user were to upload a file that exceeded this, an exception is thrown and a not so informative page is...
9
by: klausklausenator | last post by:
Hi all, I have a php-generated webpage with images. My problem is: the Internet Explorer cannot calculate the correct image size. Because of this the images are not cached. So everytime a user...
7
by: finecur | last post by:
I have a <img scr="mypic.jpg"in my html. I would like to display the image by width=200 if the image width is larger than 200. I also would like to display the image by its real width if the image...
2
pradeepjain
by: pradeepjain | last post by:
hii guys, I am storing a image in a database in form of blob and now i want to send that image as a inline image in a mail ..how to do it.. this is the code ..plzz help <?php...
0
by: ryjfgjl | last post by:
If we have dozens or hundreds of excel to import into the database, if we use the excel import function provided by database editors such as navicat, it will be extremely tedious and time-consuming...
0
by: ryjfgjl | last post by:
In our work, we often receive Excel tables with data in the same format. If we want to analyze these data, it can be difficult to analyze them because the data is spread across multiple Excel files...
0
by: emmanuelkatto | last post by:
Hi All, I am Emmanuel katto from Uganda. I want to ask what challenges you've faced while migrating a website to cloud. Please let me know. Thanks! Emmanuel
0
BarryA
by: BarryA | last post by:
What are the essential steps and strategies outlined in the Data Structures and Algorithms (DSA) roadmap for aspiring data scientists? How can individuals effectively utilize this roadmap to progress...
1
by: nemocccc | last post by:
hello, everyone, I want to develop a software for my android phone for daily needs, any suggestions?
1
by: Sonnysonu | last post by:
This is the data of csv file 1 2 3 1 2 3 1 2 3 1 2 3 2 3 2 3 3 the lengths should be different i have to store the data by column-wise with in the specific length. suppose the i have to...
0
marktang
by: marktang | last post by:
ONU (Optical Network Unit) is one of the key components for providing high-speed Internet services. Its primary function is to act as an endpoint device located at the user's premises. However,...
0
Oralloy
by: Oralloy | last post by:
Hello folks, I am unable to find appropriate documentation on the type promotion of bit-fields when using the generalised comparison operator "<=>". The problem is that using the GNU compilers,...
0
jinu1996
by: jinu1996 | last post by:
In today's digital age, having a compelling online presence is paramount for businesses aiming to thrive in a competitive landscape. At the heart of this digital strategy lies an intricately woven...

By using Bytes.com and it's services, you agree to our Privacy Policy and Terms of Use.

To disable or enable advertisements and analytics tracking please visit the manage ads & tracking page.