Re: Weirdly scaled images (again)

Jorge Arellano Cid <[email protected]> Thu, 20 Aug 2015 13:30:04 -0300

Newsgroups	gmane.comp.web.dillo.devel
Message-ID	<[email protected]>

On Wed, Aug 19, 2015 at 05:32:51PM +0200, Johannes Hofmann wrote:
> Hi Jorge,
> 
> On Tue, Aug 18, 2015 at 07:45:09PM -0300, Jorge Arellano Cid wrote:
> > On Mon, Aug 17, 2015 at 09:35:09PM +0200, August Karlstrom wrote:

> > [...]
> >
> >   FWIW, IMHO, it should scale respecting the original image ratio
> > (just pragmatics).
> > 
> >   AFAIR, it was/could-be done this way by dillo (using CSS hints) but
> > somewhere in the redesign (GROWS) these image-size hints were lost.
> > @Sebastian, @Johannes, please correct me if I'm wrong here.
> 
> as it was mentioned in this thread already the image scaling issue
> is fixed for quite some time in the main line of the dillo repo.

  Yes, but it still has some problems, as shown in August's example.

  I usually find image-scaling issues while surfing, so I *knew* there
was something there, but never found the time to dig it.

  Today I made a test page (by no means complete yet), and it shows there
are plenty of things right, and some others ignored (attached).

  The good news is that it seems the mechanisms for solving scaling are
still there, and that the main issue comes with percentages.

  As August's example tests percentages in old style HTML (not CSS),
I tested mingling a bit of CSS.

  If Sebastian confirms me there's not someting fundamentally lacking 
within percentage scaling, I could work on this issue trying to nail
the bizantine plethora of possible combinations. :-P

  FWIW, in the test-page comments, FF means Firefox.

-- 
  Cheers
  Jorge.-

_______________________________________________
Dillo-dev mailing list
[email protected]
http://lists.dillo.org/cgi-bin/mailman/listinfo/dillo-dev

img.html (text/html, 2.9 KB)

<html>
<head>
<style>
html, body { height: 100%; }
span.cmt { color:green; }
span.cmt2 { color:red; }
img.normal { height: auto; }
img.h10pct { height: 10%; }
img.h25pct { height: 25%; }
img.h50pct { height: 50%; }
img.h100pct { height: 100%; }
img.big { height: 10%; }
img.wide { width: 64px; }
img.tall { height: 64px; }
</style>
</head>

<body>

  Bare image (32x32)<img class="normal" src="smile.gif">
   <span class=cmt>OK, as FF, original size</span><br>
<hr>
  CSS w=64<img class="wide" alt="*" src="smile.gif">
   <span class=cmt>OK, as FF, natural scaling</span><br>
  CSS w=64, w=32 h=32
   <img class="wide" alt="*" src="smile.gif" width="32" height="32">
   <span class=cmt>OK, as FF, CSS width used, height as given.</span><br>
  CSS w=64, w=32
   <img class="wide" alt="*" src="smile.gif" width="32">
   <span class=cmt>OK, as FF, CSS width used, natural scaling.</span><br>
  CSS w=64, h=32
   <img class="wide" alt="*" src="smile.gif" height="32">
   <span class=cmt>OK, as FF, CSS width used, height as given.</span><br>
<hr>
  CSS h=64<img class="tall" alt="*" src="smile.gif">
   <span class=cmt>OK, as FF, natural scaling</span><br>
  CSS h=64, w=32 h=32
   <img class="tall" alt="*" src="smile.gif" width="32" height="32">
   <span class=cmt>OK, as FF, CSS height used, width as given.</span><br>
  CSS h=64, w=32
   <img class="tall" alt="*" src="smile.gif" width="32">
   <span class=cmt>OK, as FF, CSS height used, width as given.</span><br>
  CSS h=64, h=32
   <img class="tall" alt="*" src="smile.gif" height="32">
   <span class=cmt>OK, as FF, CSS height used, natural scaling.</span><br>
<hr>
  <p>CSS height=10%<img class="h10pct" src="smile.gif">
   <span class=cmt2>Dillo: nothing, FF doubles the height! (?),
    with natural scaling.</span><br>
  <p>CSS height=25%, w=32<img class="h25pct" src="smile.gif" width="32">
   <span class=cmt2>Dillo: nothing, FF uses 5*height! (?),
    width as given.</span><br>
  <p>CSS height=50, h=32%<img class="h50pct" src="smile.gif" height="32">
   <span class=cmt2>Dillo: nothing, FF uses 10*height! (?),
    CSS height used.</span><br>
  <p>CSS height=100%, w=32 h=32
   <img class="h100pct" src="smile.gif" width="32" height="32">
   <span class=cmt2>Dillo: nothing, FF uses 20*height! (?),
    width as given</span><br>
<hr>
  <img src="smile.gif"><br><img src="smile.gif"><br><img src="smile.gif"><br>
  <img src="smile.gif"><br><img src="smile.gif"><br><img src="smile.gif"><br>
  <img src="smile.gif"><br><img src="smile.gif"><br><img src="smile.gif"><br>
  <img src="smile.gif"><br><img src="smile.gif"><br><img src="smile.gif"><br>
  <img src="smile.gif"><br><img src="smile.gif"><br><img src="smile.gif"><br>
  <img src="smile.gif"><br><img src="smile.gif"><br><img src="smile.gif"><br>
  <img src="smile.gif"><br><img src="smile.gif"><br><img src="smile.gif"><br>
  <img src="smile.gif"><br><img src="smile.gif"><br><img src="smile.gif"><br>
</html>

smile.gif (image/gif, 1 KB) - not displayed