如何使用css在同一位置显示2个元素？ [英] How can I display 2 elements in the same position using css?

问题描述

 < div> 
< ul class =social-icon> 
< li> 
< a href =＃class =social-facebook> 
< i class =fa fa-facebook>< / i> 
< i class =fa fa-facebook ff>< / i> 
< / a> 
< / li> 
< / ul> 
< / div> 
  

我想在同一位置显示这两个图标，如一个图标...请帮助我。对不起，我的英语不好。
这里是jsfiddle编辑器链接

解决方案

使用以下css：

  .social-facebook {
位置：相对; 
} 
 
 .fa-facebook {
 position：absolute; 
 top：0px; 
 left：0px; 
} 
  

注意：您可以根据自己的喜好调整左/ p>

这是更新的小提琴： http://jsfiddle.net/2N2YF/32/

<div>
<ul class="social-icon">
    <li>
        <a href="#" class="social-facebook">
          <i class="fa fa-facebook"></i>
          <i class="fa fa-facebook ff"></i>
        </a>
    </li>
</ul>
</div>

I want to display this two icon in same position like one icon...Please Help me. Sorry for my Bad English. Here is jsfiddle editor link

解决方案

Use the following css:

.social-facebook {
  position:relative;
}

.fa-facebook {
  position: absolute;
  top: 0px;
  left: 0px;
}

Note: You can tweak the left/top properties to your liking.

Here's the updated fiddle: http://jsfiddle.net/2N2YF/32/

这篇关于如何使用css在同一位置显示2个元素？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！