Question

在网站的右侧，您会在图像旁边找到2张图片和文字

这是我所说的HTML代码：

<div id="contact-info">
    <div id="adresa">
        <div id="addPadding" style="padding: 2em;">
            <img src="http://avocat.dac-proiect.ro/wp/wp-content/themes/twentyfourteen/images/ADRESA.png" style="width:22px;height:31px;float:left;display: inline;">
            <div style="float: right;display: inline;width: 80%;">
                <p style="text-align:left;">Calea Dorobantilor,nr.74,<br>bl.Y9,SC.2,Ap.25<br>Cluj-Napoca,400609<br>Romania</p>
            </div>
        </div>
    </div>

    <div id="telefon">
        <div id="addPadding" style="padding-top: 90px;">
            <img src="http://avocat.dac-proiect.ro/wp/wp-content/themes/twentyfourteen/images/TELEFON.png" style="width:22px;height:31px;float:left;display: inline;">
            <div style="float: right;display: inline;width: 80%;">
                <p style="text-align:left;">Calea Dorobantilor,nr.74,<br>bl.Y9,SC.2,Ap.25<br>Cluj-Napoca,400609<br>Romania</p>
            </div>
        </div>
    </div>  

    <div id="mail"></div>
</div></div>

我想将第二行中的文本和图像移动到第一行中

这是网站：

http://avocat.dac-proiect.ro/wp/

我尝试在此代码<div id="addPadding" style="padding-top: 90px;padding-left:X value;">添加padding-left但正确安排

我该如何解决这个问题？

谢谢！

Answer 1

改变这个：

style="padding-top: 90px;

到此：

style="padding: 90px 2em;

（并更改第二个div的id以使其唯一。）

FIDDLE

Answer 2

将所有内容放在像这样的表中

<table style="width:100%">
    <tr>
        <td>
            <img src="http://avocat.dac-proiect.ro/wp/wp-content/themes/twentyfourteen/images/ADRESA.png">
        </td>
        <td>
            <p style="text-align:left;">Calea Dorobantilor,nr.74,<br>bl.Y9,SC.2,Ap.25<br>Cluj-Napoca,400609<br>Romania</p>
        </td>
        <td>
            <img src="http://avocat.dac-proiect.ro/wp/wp-content/themes/twentyfourteen/images/TELEFON.png">
        </td>
        <td>
            <p style="text-align:left;">Calea Dorobantilor,nr.74,<br>bl.Y9,SC.2,Ap.25<br>Cluj-Napoca,400609<br>Romania</p>
        </td>
   </tr>
</table>

tr是行标记，td是列标记。我不会用CSS来做这件事要困难得多。

安排相应的文字

2 个答案: