html - “A” tag wrapping “IMG” seems incorrect size. (32 * 32px is shown as 38 * 21px) -

-

the following issued codes (http://jsfiddle.net/dz754deg/1/).

a{    text-decoration: none;  }
<a href="#">    <img src="http://lorempixel.com/32/32/"/>  </a>  <a href="#">    <img src="http://lorempixel.com/32/32/"/>  </a>

the result isn’t strange seemingly. if check browser’s built-in developer tools, a tag has incorrect size. in chrome (latest version), img tag normal (32 * 32px). a tag odd (38 * 21px or 32 * 21px).

this image might help:

you can see element has inconsistent size

firefox has same issue. think isn’t browser-specific. how can fix gracefully?

these 2 styles make blocks appear correctly:

a{     display:inline-block; } img{     display:block; }

it’s because of how inline , block level elements rendered. can still click on inline link wrapped around image everywhere image looks if couldn’t.

jsfiddle demo

screenshots rendered in firefox:

img elementa element


Comments

Post a Comment

Popular posts from this blog

java - Ebean enhancement ignores a model -

-
we using avaje-agentloader enhance our ebeans. ebeans in same package. including loader, agent & base ebean library in our project (via sbt): "org.avaje" % "avaje-agentloader" % "1.1.2", "org.avaje.ebeanorm" % "avaje-ebeanorm" % "4.5.5", "org.avaje.ebeanorm" % "avaje-ebeanorm-agent" % "4.5.2", however, when loader runs enhancement, skips 1 ebean. each ebean annotated @entity , extends com.avaje.ebean.model . there seem no differences between ones enhanced , 1 not. there no includes, or extends, etc. basically, i'm wondering if has run across issue in past, or has insights. things we've tried: specifying actual classes enhanced via serverconfig.setclasses(...) specifying pakages analyse/enhance via serverconfig.addpackage(...) or setpackages(...) not specifying @ , having loader analyse all. we've set break-point @ transformer.transform , bean in questio...
Read more

ubuntu - How to disable Kernel Module Signing in linux -

-
i'm working real time scheduler developed @ university , when run "module verification failed: signature and/or required key missing - tainting kernel". i've learned might because of kernel module signing. possible dissable on ubuntu? i'm using ubuntu vmplayer. module signing enabled within kernel configuration file starting kernel version 3.7, can disable running make menuconfig within kernel source directory , deselecting module signature verification option within enable loadable kernel module menu option. after have recompile kernel.
Read more

SQL php on different pages to Insert (mysqli) -

-
i have piece of php code, works when placed on index page ( index.php ), nothing if put in page, i.e. add.php for example: having code add.php page, tried go to: www.myhost.com/add.php , nothing happen. if copy code index.php , go page www.myhost.com/index.php add row in sql table. why that? <?php $server="mysql.server.com"; $user="randomusr"; $pass="randompwd"; $db="randomdb"; $link=mysqli_connect($server, $user, $pass, $db); $result=mysqli_query($link,"select * `battery` `id`"); $query = "insert battery (id,type,owner,charge,time) values ('1','lily002','maisnow','15','2015-04-22 17:20:28')"; mysqli_query($link, $query); header("location: index.php"); //this 1 comment out when copied index.php ?> l # name type collation attributes null 1 id int(16) no ...
Read more