表：新行中的额外文本

Question

我有一张照片。

现在，我怀疑的是，如果文字太长，我希望图片下面的文字在新行。当我输入长文本时，单元格（td）被放大，我不想成为。

所以我希望额外的文字在新的一行。它应该限制在图像的宽度之后，额外的文本应该在新行中。

我无法使用 div 和位置属性。我只能使用表格标记。

图像高度应相同。我尝试使用自动换行，空格，但图像高度因此而异。

＆＃13;

＆＃13;

<table bgcolor="black" style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt; border: thin white solid; " align="left" border="0" cellpadding="0" cellspacing="0"  >
                                                <tbody>

                                                <td align="center">
                                                    <table  style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;" align="center" border="0" cellpadding="0" cellspacing="0" width="120">
                                                        <tbody><tr>
                                                            <td align="center" height="100" valign="top" width="100">
                                                                <p style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;"><a class="modimg" style="text-decoration: none!important;" href="#"><img style=" border: 3px solid #ffcbbc ; outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;" alt="" src="http://www.hubilo.com/eventApp/ws//images/speaker/profile/thumb/2712_1455301580.jpeg" border="0" height="110" width="110" ></a></p>
                                                            </td>
                                                        </tr>
                                                        </tbody></table>
                                                </td>


                                                <tr>
                                                    <td class="h2" style=" font-weight: bold ;font-family: 'proxima_nova_rgregular', Arial, helvetica, sans-serif;font-size: 10px;padding-top: 2px;padding-bottom: 0px;color:#ffffff;">
                                                       <p style="padding:0; margin:0;text-align: center;"> <span class="wrap_textbox">dsdsfsdfsdsfsdsdgsgdsdfsdfd</span></p>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td class="h2" style="font-family: 'proxima_nova_rgregular', Arial, helvetica, sans-serif;font-size: 8px;text-align: center;color: #ffffff;">
                                                        <span class="wrap_textbox">Co-Founder at SeeFund</span>
                                                    </td>
                                                </tr>

                                                </tbody>

                                            </table>


                                            <!--Speaker 2-->

                                            <table  style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt; margin: 0 auto; margin-left: 15px;  " align="left" border="0" cellpadding="0" cellspacing="0" >
                                                <tbody>
                                                <tr>
                                                    <td align="center">
                                                        <table style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;" align="center" border="0" cellpadding="0" cellspacing="0" width="120">
                                                            <tbody><tr>
                                                                <td align="center" height="100" valign="top" width="100">
                                                                    <p style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;"><a class="modimg" style="text-decoration: none!important;" href="#"><img style=" border: 3px solid #ffcbbc ; outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;" alt="" src="http://www.hubilo.com/eventApp/ws//images/speaker/profile/thumb/2712_1455949782.jpeg" border="0" height="110" width="110" ></a></p>
                                                                </td>
                                                            </tr>
                                                            </tbody></table>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td class="h2" style=" font-weight: bold ;font-family: 'proxima_nova_rgregular', Arial, helvetica, sans-serif;font-size: 10px;padding-top: 5px;padding-bottom: 0px;text-align: center;color:#ffffff; ">
                                                        <span class="wrap_textbox">Mr. R Chandrasekhar</span>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td class="h2" style="font-family: 'proxima_nova_rgregular', Arial, helvetica, sans-serif;font-size: 8px;text-align: center;color: #ffffff;">
                                                        <span class="wrap_textbox">President of NASSCOM</span>
                                                    </td>
                                                </tr>
                                                </tbody>
                                            </table>



                                            <!--Speaker 3 -->

                                            <table  style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt; margin: 0 auto;  margin-left: 15px;  " align="left" border="0" cellpadding="0" cellspacing="0" >
                                                <tbody>
                                                <tr>
                                                    <td align="center">
                                                        <table style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;" align="center" border="0" cellpadding="0" cellspacing="0" width="120">
                                                            <tbody><tr>
                                                                <td align="center" height="100" valign="top" width="100">
                                                                    <p style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;"><a class="modimg" style="text-decoration: none!important;" href="#"><img style=" border: 3px solid #ffcbbc ; outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;" alt="" src="http://www.hubilo.com/eventApp/ws//images/speaker/profile/thumb/2712_1455627060.jpeg" border="0" height="110" width="110" ></a></p>
                                                                </td>
                                                            </tr>
                                                            </tbody></table>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td class="h2" style=" font-weight: bold ;font-family: 'proxima_nova_rgregular', Arial, helvetica, sans-serif;font-size: 10px;padding-top: 5px;padding-bottom: 0px;text-align: center;color:#ffffff;">
                                                        <span class="wrap_textbox">Mr. Jay Panda</span>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td class="h2" style="font-family: 'proxima_nova_rgregular', Arial, helvetica, sans-serif;font-size: 8px;text-align: center;color: #ffffff;">
                                                        <span class="wrap_textbox">Member of Parliament</span>
                                                    </td>
                                                </tr>
                                                </tbody>
                                            </table>


                                            <!--Speaker 4 -->


                                            <table  style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt; margin: 0 auto;  margin-left: 15px;  " align="left" border="0" cellpadding="0" cellspacing="0" >
                                                <tbody>
                                                <tr>
                                                    <td align="center">
                                                        <table style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;" align="center" border="0" cellpadding="0" cellspacing="0" width="120">
                                                            <tbody><tr>
                                                                <td align="center" height="100" valign="top" width="100">
                                                                    <p style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;"><a class="modimg" style="text-decoration: none!important;" href="#"><img style="border: 3px solid #ffcbbc; outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;" alt="" src="http://www.hubilo.com/eventApp/ws//images/speaker/profile/thumb/2712_1455300140.jpeg" border="0" height="110" width="110" ></a></p>
                                                                </td>
                                                            </tr>
                                                            </tbody></table>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td class="h2" style=" font-weight: bold ;font-family: 'proxima_nova_rgregular', Arial, helvetica, sans-serif;font-size: 10px;padding-top: 5px;padding-bottom: 0px;text-align: center;color:#ffffff;">
                                                        <span class="wrap_textbox">Ms. Shazia Ilmi</span>
                                                    </td>
                                                </tr>
                                                <tr>
                                                    <td class="h2" style="font-family: 'proxima_nova_rgregular', Arial, helvetica, sans-serif;font-size: 8px;text-align: center;color: #ffffff;">
                                                        <span class="wrap_textbox">Spokesperson at BJP</span>
                                                    </td>
                                               </tr>
                                    </table>

＆＃13;

＆＃13;

＆＃13;

Answer 1

所以这就是我所做的......

＆＃13;

＆＃13;

<table bgcolor="black" style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt; border: thin white solid; " align="left" border="0" cellpadding="0" cellspacing="0"  >
    <tbody>

    <td align="center">
        <table  style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;" align="center" border="0" cellpadding="0" cellspacing="0" width="120">
            <tbody><tr>
                <td align="center" height="100" valign="top" width="100">
                    <p style="border-collapse: collapse;mso-table-lspace: 0pt;mso-table-rspace: 0pt;"><a class="modimg" style="text-decoration: none!important;" href="#"><img style=" border: 3px solid #ffcbbc ; outline: none;text-decoration: none;-ms-interpolation-mode: bicubic;" alt="" src="http://www.hubilo.com/eventApp/ws//images/speaker/profile/thumb/2712_1455301580.jpeg" border="0" height="110" width="110" ></a></p>
                </td>
            </tr>
            </tbody></table>
    </td>


    <tr>
        <td class="h2" style=" font-weight: bold ;font-family: 'proxima_nova_rgregular', Arial, helvetica, sans-serif;font-size: 10px;padding-top: 2px;padding-bottom: 0px;color:#ffffff;">
            <p style="padding:0; margin:0;text-align: center; max-width:116px;"> <span class="wrap_textbox">Lorem ipsum dolor sit amet, consectetur adipisicing elit. A consequuntur corporis, debitis dignissimos error fuga id inventore laudantium officiis quae quam, quia quos, repudiandae saepe sed sint tenetur? Doloribus, recusandae?</span></p>
        </td>
    </tr>
    <tr>
        <td class="h2" style="font-family: 'proxima_nova_rgregular', Arial, helvetica, sans-serif;font-size: 8px;text-align: center;color: #ffffff;">
            <span class="wrap_textbox">Co-Founder at SeeFund</span>
        </td>
    </tr>

    </tbody>

</table>

＆＃13;

＆＃13;

＆＃13;

只需添加：max-width:116px;（或任何您满意的最大宽度），然后将其自我移动到新线上。

已更新

这是我添加样式的行：

       <p style="padding:0; margin:0;text-align: center; max-width:116px;">

我强烈建议将这些内容放入CSS类中，然后再放入样式表中，因为如果您希望将来调整代码，则必须进入每个文件并调整{{1}您已将每个标记下的标记添加到。