View Single Post
Old 11-24-2014, 06:57 AM   #2
RbnJrg
Wizard
RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.RbnJrg ought to be getting tired of karma fortunes by now.
 
Posts: 1,782
Karma: 8700631
Join Date: Mar 2013
Location: Rosario - Santa Fe - Argentina
Device: Kindle 4 NT
Quote:
Originally Posted by SBT View Post
In my stylesheet file, if I write something like this:
Code:
img {
width:76%;
height:auto;
}
the image is scaled accordingly on both e-ink and fire devices, but if I increase the width to 77% (or more), the width is set to 100% on eink-devices.
This happens both on the previewer and on actual devices.
Have I missed something? And is there a better workaround than using @media device-width/height and setting an absolute width?
What if you enclose the image in a <div> tag with the width you want? Something like:

Code:
div.image1 {
    width: 80%;
}

img {
    width: 100%;
    height: auto;
}
and in the .xhtml file:

Code:
<div class="image1">
     <img alt="" src="../Images/MyImage.png" />
</div>
Maybe that code could solve your present issues.

Regards
Rubén
RbnJrg is offline   Reply With Quote