Как выровнять текстовые кнопки в HTML

Я пытаюсь выровнять 3 текстовых поля по горизонтали, хотел бы получить совет / помощь!

Все они должны быть в ряд, но укладываются горизонтально.

Я считаю, что это как-то связано с тегами td и table.

 <table width = "600" border = "0" align = "center" cellpadding = "0" cellspacing = "0" class = "center">
     <tbody>

     <td align = "left" style = "color: #808488; font-size: 10px; font-family:Arial; padding:0px 0px 0px 0px">
       <a href = "" style = "color:#ffffff; text-decoration:none">
       <table width = "150" border = "0" cellspacing = "0" cellpadding = "0" bgcolor = "#00c0a5" style = "border-radius:4px">
       <tbody>

 <td align = "center" style = "padding:15px 10px 15px 10px; color:#ffffff; font-size:10px; font-family:Arial">Repayment Calculator</td>



          <table width = "600" border = "0" align = "center" cellpadding = "0" cellspacing = "0" class = "center">


     <td align = "middle" style = "color: #808488; font-size: 10px; font-family:Arial; padding:0px 0px 0px 0px">
       <a href = "" style = "color:#ffffff; text-decoration:none">
       <table width = "150" border = "0" cellspacing = "0" cellpadding = "0" bgcolor = "#00c0a5" style = "border-radius:4px">



 <td align = "center" style = "padding:15px 10px 15px 10px; color:#ffffff; font-size:10px; font-family:Arial">Borrowing Power Calculator</td>




             <table width = "600" border = "0" align = "center" cellpadding = "0" cellspacing = "0" class = "center">
     <tbody>

     <td align = "right" style = "color: #808488; font-size: 10px; font-family:Arial; padding:0px 0px 0px 0px">
       <a href = "" style = "color:#ffffff; text-decoration:none">
       <table width = "150" border = "0" cellspacing = "0" cellpadding = "0" bgcolor = "#00c0a5" style = "border-radius:4px">
       <tbody>


 <td align = "center" style = "padding:15px 10px 15px 10px; color:#ffffff; font-size:10px; font-family:Arial">Property Report</td>
    </tr>
     </tbody>
   </table>
   </td>
    </tr>
  </tbody>
   </table></td>

Есть ли причина, по которой вы используете несколько таблиц / таблиц в таблицах?

— 15.05.2018 05:16

html text alignment

15.05.2018 04:50

Улучшение производительности загрузки с помощью Google Tag Manager и атрибута Defer

В настоящее время производительность загрузки веб-сайта имеет решающее значение не только для удобства пользователей, но и для ранжирования в...

Введение в CSS

CSS является неотъемлемой частью трех основных составляющих front-end веб-разработки.

Как выровнять Div по центру?

Чтобы выровнять элемент <div>по горизонтали и вертикали с помощью CSS, можно использовать комбинацию свойств и значений CSS. Вот несколько методов,...

Навигация по приложениям React: Исчерпывающее руководство по React Router

React Router стала незаменимой библиотекой для создания одностраничных приложений с навигацией в React. В этой статье блога мы подробно рассмотрим...

Система управления парковками с использованием HTML, CSS и JavaScript

Веб-сайт по управлению парковками был создан с использованием HTML, CSS и JavaScript. Это простой сайт, ничего вычурного. Основная цель -...

Toor - Ангулярный шаблон для бронирования путешествий

Toor - Travel Booking Angular Template один из лучших Travel & Tour booking template in the world. 30+ валидированных HTML5 страниц, которые помогут...

Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

<table width = "600" border = "0" align = "center" cellpadding = "0" cellspacing = "0" class = "center">
     <tbody>
 <td align = "left" style = "color: #808488; font-size: 10px; font-family:Arial; padding:0px 0px 0px 0px; width:33%;">
       <a href = "" style = "color:#ffffff; text-decoration:none">
       <table width = "100%" border = "0" cellspacing = "0" cellpadding = "0" bgcolor = "#00c0a5" style = "border-radius:4px">
       <tbody>
<tr>
 <td align = "center" style = "padding:15px 10px 15px 10px; color:#ffffff; font-size:10px; font-family:Arial">Repayment Calculator</td>
</tr>
</tbody></table>
</td>
<td align = "left" style = "color: #808488; font-size: 10px; font-family:Arial; padding:0px 0px 0px 0px; width:33%;">
          <table width = "100%" border = "0" align = "center" cellpadding = "0" cellspacing = "0" class = "center">
<tbody>

<tr>

     <td align = "middle" style = "color: #808488; font-size: 10px; font-family:Arial; padding:0px 0px 0px 0px">
       <a href = "" style = "color:#ffffff; text-decoration:none">
       <table width = "100%" border = "0" cellspacing = "0" cellpadding = "0" bgcolor = "#00c0a5" style = "border-radius:4px">
<tbody>

<tr>
 <td align = "center" style = "padding:15px 10px 15px 10px; color:#ffffff; font-size:10px; font-family:Arial">Borrowing Power Calculator</td>
</tr>
</tbody></table>
</td>
</tr>
</tbody></table>
</td>
<td style = "width:33%;">


             <table width = "100%" border = "0" align = "center" cellpadding = "0" cellspacing = "0" class = "center">
     <tbody><tr>

     <td align = "right" style = "color: #808488; font-size: 10px; font-family:Arial; padding:0px 0px 0px 0px">
       <a href = "" style = "color:#ffffff; text-decoration:none">
       <table width = "100%" border = "0" cellspacing = "0" cellpadding = "0" bgcolor = "#00c0a5" style = "border-radius:4px">
       <tbody>
<tr>
 <td align = "center" style = "padding:15px 10px 15px 10px; color:#ffffff; font-size:10px; font-family:Arial">Property Report</td>
 </tr>
 </tbody></table>
</td>
</tr>
 </tbody></table>
 </td>
    </tr>
     </tbody>
   </table>

Вложенные таблицы приводят к выравниванию релейной диаграммы. Вышеупомянутый код аккуратно закрывает теги "table", а также ширина тега "td" регулируется до 33%.

— 15.05.2018 05:20

15.05.2018 05:17