Sadly, the simple answer is that you probably cannot set width or height to an exact value on an img tag and trust that it will display at exactly that size. The closest mechanism I ever found was simply to use a clipped div with a background image and constrain it on every measure using CSS:
>
> Image 1 below left width=200.
> Image 2 below right width=300.
> Image 3 at the bottom is actual size 400.
> > >
>
> > -------------------------------------------------------- > 4x3results.jpg is a screen shot of the html code results: > Image 1 screen shot actually measures 278x211 pixels > Image 2 screen shot actually measures 582x536 pixels > Image 3 screen shot actually measures 775x586 pixels > > It doesn't matter what monitor the html code is viewed on or what browser > is used. The resulting image sizes are never the same pixel width (and > dimensions) of what is specified by the 'img src' width or even the image > original. > > All of the results are wacko. > > Why? > > How can I specify image size width and/or width and height that will > display at the specified size on SOME computer monitor with SOME browser? > > > -------------------------- > Joseph Sinclair last wrote: >> Each browser does sizing according to it's own rules, but specifying only >> width generally throws it into aspect-ratio match mode which will be >> approximate. >> Further complicating things is that height and width are interpreted as >> "CSS Pixels" which are not always exactly screen pixels (depending on CSS >> and accessibility settings, particularly the display DPI settings). >> Try specifying both width and height to get a proper clipping box and see >> if that works or if you see the same 1.4:1 ratio on both height and width >> (which would indicate an accessibility ratio setting on the device or O/S >> side). >> You might also wish to (temporarily) set the CSS width and height >> properties and overflow mode as follows to see if the image really is >> outside what the browser *thinks* is the correct size : style="width: >> 270; height: NNN; overflow: hidden" (replace NNN with the correct >> height, of course). >> If the image isn't clipped but is still 380px wide with the style set, >> then it's almost certain the device has accessibility or other settings >> to map multiple device pixels to one "CSS Pixel". >> >> If your target environment fully supports CSS3, you might try using the >> resolution style (style="width: 270; resolution: 1dppx !important") to >> explicitly request a 1:1 pixel ratio for that element (browsers get final >> say and may ignore resolution in favor of accessibility). > > > > --------------------------------------------------- > PLUG-discuss mailing list - PLUG-discuss@lists.phxlinux.org > To subscribe, unsubscribe, or to change your mail settings: > http://lists.phxlinux.org/mailman/listinfo/plug-discuss >