On Sat, Nov 15, 2008 at 9:58 PM, Peter Hyde-Smith
<[EMAIL PROTECTED]> wrote:
>
> ----- Original Message ----- From: "Henrik Nyh" <[EMAIL PROTECTED]>
>> I'm seeing an unexpected issue where an image inside a div is not
>> contained by the div, if the browser window is smaller than the image
>> width. [snip]
>
> If the viewport is not
> 1280+60+2+20 = 1362px (more or less) in dimension, the image will never be
> constrained and centered in the <div> because the image overflow property
> defaults to visible. If you want to prevent the image from overflowing the
> <div>, you have to declare img {overflow: hidden;}, although that doesn't
> resolve an issue with the right padding not being present.

Thanks for your reply!

I'm afraid overflow:hidden (on the div; don't think it has any effect
on the img) isn't what I want, since it hides part of the img instead
of making the containing div wider.

Another thing, if
> the viewport is larger than 1362px, the div will be (much) larger than the
> img. I think you're SOL if you don't want to scale the image. Otherwise,
> declare img {width: 100%} in the CSS, or do the same thing in the XHTML,
> <img src=.........jpg width="100%" alt="" />

Yeah, as I mentioned in my reply to Gunlaug's solution, I might scale
the image with max-width. It won't be exactly what I want, but in this
case better than the image breaking out of the div, and probably
better than workarounds on top of workarounds.
______________________________________________________________________
css-discuss [EMAIL PROTECTED]
http://www.css-discuss.org/mailman/listinfo/css-d
List wiki/FAQ -- http://css-discuss.incutio.com/
List policies -- http://css-discuss.org/policies.html
Supported by evolt.org -- http://www.evolt.org/help_support_evolt/

Reply via email to