Question

我一直在努力解决这个问题已经有一段时间没事了，我尝试过的任何事情都有所作为。

我有一部分我正在显示它只是在html表中显示静态数据。但是我的对象的电子邮件字段搞乱了整个表格而不允许它自动换行。

我在表格中添加了边框，以便您可以更轻松地查看发生的事情。这是我的显示器上最大比例的页面：

请注意公司和转包商中的电子邮件。如果我缩小页面，表格不会调整大小，没有任何单词包装如下：

但是，如果我只是得到表单代码并删除显示的电子邮件，一切正常。以上是上图，没有公司和分包商的电子邮件：

桌子保持在他们的边界内，并且适当地缩放和自动换行。

我的部分代码是：

    <div class="row">
      <div class="large-4 columns">
        <div class="label_style">
          <h4 id="label_style">Company</h4>
        </div>
        <div class="table">
          <table>
            <tr>
              <td id="job_info"><strong>Name</strong></td>
              <td id="job_info"> <%= @job.company.name %> </td>
            </tr>
            <tr>
              <td id="job_info"><strong>Phone</strong></td>
              <td id="job_info"> <%= @job.company.phone %> </td>
            </tr>
            <tr>
              <td id="job_info"><strong>Street</strong></td>
              <td id="job_info"> <%= @job.company.street %> </td>
            </tr>
            <tr>
              <td id="job_info"><strong>City</strong></td>
              <td id="job_info"> <%= @job.company.city %> </td>
            </tr>
            <tr>
              <td id="job_info"><strong>State</strong></td>
              <td id="job_info"> <%= @job.company.state %> </td>
            </tr>
            <tr>
              <td id="job_info"><strong>Zip</strong></td>
              <td id="job_info"> <%= @job.company.zip %> </td>
            </tr>
            <tr>
              <td id="job_info"><strong>Email</strong></td>
              <td id="job_info"> <%= @job.company.email %> </td>
            </tr>
            <tr>
              <td id="job_info"><strong>Website</strong></td>
              <td id="job_info"> <%= @job.company.website %> </td>
            </tr>
          </table>
        </div> <!-- closing table -->
      </div> <!-- closing columns -->

这适用于公司，而分包商完全相同，但它是@job.subcontractor.email。

公司和转包商的迁移文件也是如此：

class CreateCompanies < ActiveRecord::Migration
  def change
    create_table :companies do |t|
      t.string :name
      t.string :phone
      t.string :street
      t.string :city
      t.string :state
      t.string :zip
      t.string :email
      t.string :website

      t.timestamps null: false
    end
  end
end

有谁知道为什么电子邮件字符串弄乱我的表并阻止它们自动换行并正确显示？

Answer 1

这些电子邮件不能包装，因为它们只包含一个单词。我建议限制它们的宽度并截断它们（同时仍然在工具提示中暴露全部值）。

＆＃13;

.email {
  max-width: 100px;
  overflow: hidden;
  text-overflow: ellipsis;
}

＆＃13;

  <div class='email' title='aasdfasdfasgdf@gmail.com'>aasdfasdfasgdf@gmail.com</div>

＆＃13;

Rails - 电子邮件字符串拒绝在表内进行自动换行

1 个答案: