将浮动图像对齐另一个

Question

我正在使用以下HTML代码：

    <div style="background-image: url('Images/banner-transparente.jpg');overflow:hidden;">
    <img src="../Images/A3_2.png" class="icones thumbnail img-circle" alt="A3" style="height:5%; width:5%;float:right;">
    <a href="#" style="float: right;" id="autenticacao">Autenticação: Kerberos </a>
    <img src="../Images/logo-trt-home.png" class="img-responsive">
</div>

JSFiddle

问题是生成的代码图像如下所示：

但是，我会得到此图中显示的结果，能够将图像移动到背景图像上并将文本置于浮动图像的下方或顶部中心，如下例所示：

Answer 1

将clear:both添加到<a>样式，您也可以向右边缘和边距顶部移动一点：

 <img src="http://s15.postimg.org/ra8y0o7az/A3_2.png" class="icones thumbnail img-circle" alt="A3" style="height:5%; width:5%;float:right; margin:20px 50px 0 0;">
 <a href="#" style="float: right;clear:both;" id="autenticacao">Autenticação: Kerberos </a>

JSFiddle