Resizing Images

[JSWolf]

Originally Posted by Gunivortus

Formatting the text works fine, but there are also pictures. I like to get them resized to the screen on which the book is read.
Now, the pictures are small at any device, just take ca. 1/4 of a screen.
How can I get them flexible resized?

Here is the CSS and HTML code that I use to size images to be the full screen keeping the correct aspect ratio.

CSS code:

body {
  widows: 1;
  orphans: 1;
  margin-top: 0;
  margin-right: 0;
  margin-bottom: 0;
  margin-left: 0;
  text-align: justify;
}
img {
  max-height: 100%;
  max-width: 100%;
}
.cover {
  text-align: center;
  text-indent: 0;
  height: 100%;
}

HTML code:

<div class="cover"><img alt="" class="cover" scr="../images/image.jpg"></div>

[Gunivortus]

Thanks! Where do I add that?

[JSWolf]

Originally Posted by Gunivortus

Thanks! Where do I add that?

The CSS goes in the CSS file. Make sure you are not duplicating nay styles such as two body styles.

The HTML code goes where the code is to display your images. But you will need the correct source (path/filename). Get the source from the <img> that you are replacing.

The reason the class is called cover is because I use it mostly for the cover and title page.

[DiapDealer]

Moderator Notice
@Jon: Do not take it upon yourself to "move" posts by cross replying in this manner. As I have mentioned many times: report posts you feel are in the wrong place. After that, your part of the process is officially over. I'm closing this (essentially) duplicate thread. You don't get to thwart the powers that be in this manner. You have been warned.