Quote:
Originally Posted by phillipgessert
My advice would be to get away from InDesign for this, and also to not set a height value at all. You should also avoid using fixed units like pixels. Instead I would set your landscape photos at width: 100%.
Portrait, I’m less sure. Perhaps start at something like 70% for those, and experiment from there.
Code:
<div class="landscape">
<img src="image.jpg" alt="a wide image"/>
</div>
<div class="portrait">
<img src="image2.jpg" alt="a tall image"/>
</div>
Code:
.landscape img {
width: 100%;
}
.portrait img {
width: 70%;
margin-left: 15%;
}
|
It looks to me from the quoted code that the containing block is bloody tiny, vis:
height:343px;
width:595px;
And then the contained element is 100% of that. I mean, sh*t, 343px is roughly...what, an eighth of the width of a Fire tablet screen in landscape now and what, one-fourth of the width of it in portrait? TEENY.
For an Oasis, at 1,680 × 1264 pixels, again, you'd be talking a fourth-to-third of the width.
It's the container that's constraining the image. If you use Phillip's stuff, you won't have to worry about that.
Hitch