如何将两个锚标记与水平相邻的文本对齐? [英] How to align two anchor tags with text horizontally next to each other?

问题描述

我正在一个网站上，我需要将带有文本的锚标签放在一起.我试过了，但是我先得到了两个图像，然后又得到了水平的两个文本.

I'm working on a website, i need to put anchortag with text side by side. I tried, but i get the two images first and then the two text horizontally.

html:

<div id="section">
    <ul>
        <li>
            <a class="bt btleft" href="#"><img  src="jqe13/image/web.png" 
            id="photoSelect" />web</a>
           <a class="bt btleft" href="#"><img title="Facebook"  src="jqe13/image
   /Facebook1.png" />Download</a>

        </li>
    </ul>
</div>

css:

  #section {
  width: 82%;
   margin: 15px auto 0 auto;
    padding: 2%;
    border-radius: 12px;
    border: 1px solid #e0e0e0;
    }

我如何并排显示图像和文字?

how can i get the image and text side by side?

推荐答案

尝试这个

  #section {
  width: 82%;
   margin: 15px auto 0 auto;
    padding: 2%;
    border-radius: 12px;
    border: 1px solid #e0e0e0;
    display:table;
    }
#section ul li
{
    display:table-cell;
}
#section ul li a
{
    vertical-align:middle;
    text-align:center;
}
#section ul li a img
{
    vertical-align:middle;
    text-align:center;
}

http://jsfiddle.net/g8ZbM/3/

这篇关于如何将两个锚标记与水平相邻的文本对齐?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！