フッターの右側にあるCSS画像

Question

ページにリンクしている2つの画像でフッターを作成しようとしています。

2つのリンク/画像は、フッターの右側に残ります。

画像は少し余裕を持って隣り合っていなければなりません。

これをCSSでどのように管理できますか？

<footer> 
    <a href="http://www.google.de/" target="_blank"> 
     <img src="test.jpg" alt="logo.jpg"> 
    </a> 
    <a href="http://www.google.de" target="_blank"> 
     <img src="test.jpg" alt="logo.jpg"> 
    </a> 
</footer> 

Answer 1

はdiv要素でそれらをラップし、それをフロートしてみてください。

CSS：

.images-container { 
    float: right; 
} 

.images-container a { 
    margin-left: 5px; 
} 

HTML：

<footer> 
<div class="images-container"> 
    <a href="http://www.google.de/" target="_blank"> 
     <img src="test.jpg" alt="logo.jpg"> 
    </a> 
    <a href="http://www.google.de" target="_blank"> 
     <img src="test.jpg" alt="logo.jpg"> 
    </a> 
</div> 
</footer> 

Answer 2

あなたは、ブートストラップのフレームワークを使用している場合。このコード

HTML

<footer class="clearfix"> 
    <ul class="links pull-right"> 
    <li> <a href="http://www.google.de/" target="_blank"> 
     <img src="test.jpg" alt="logo.jpg"> 
    </a> 
    </li> 
    <li> 
    <a href="http://www.google.de" target="_blank"> 
     <img src="test.jpg" alt="logo.jpg"> 
    </a> 
     </li> 
    </ul> 
</footer> 

CSS

.links 
{ 
    list-style-type:none; 
    padding:0; 
} 
.links li 
{ 
    display:inline-block; 
} 

Answer 3

あなたはfloatを使用することができます：あなたのハイパーリンクの右

footer a { 
 
float:right; 
 
} 
 
footer a:first-child { 
 
margin-left: 10px; 
 
}

<footer> 
 
    <a href="http://www.google.de/" target="_blank"> 
 
     <img src="http://placehold.it/50" alt="logo.jpg"> 
 
    </a> 
 
    <a href="http://www.google.de" target="_blank"> 
 
     <img src="http://placehold.it/50" alt="logo.jpg"> 
 
    </a> 
 
</footer>