0

I have a privacy field (values are To: or Bcc:) and an email address field that are outputted from my database. I want the email address to always be after the To: / Bcc: and not moved a line down when the email address is too long.

The button is position: absolute so it shouldn't be affecting the text position.

The longest email address on my database (so far) is 41 characters long.

I've used this method to break the email address when it reaches the end of the cell, with the remaining part of the email address continued on the next line down:

<tr>
<td>Email:</td>
<td style="word-wrap: break-word"><?php echo $Privacy; ?> <span><?php echo $Email; ?></span> <button class="copy">COPY</button></td>
</tr>

... this doesn't work in IE9. I need to have at least five characters for the privacy field (Bcc: ) and then 36 characters after that before wrapping needs to take place.

Am I using the CSS for something other than it's purpose? Text-wrap doesn't appear to be supported anymore. Is JavaScript or PHP needed to address this?

thank you

Zuno
  • 433
  • 1
  • 7
  • 17
  • Just saw this similar answer that seemed to help the OP. Maybe it will help for you, too. http://stackoverflow.com/questions/16098785/word-wrap-not-working-in-internet-explorer?noredirect=1#16100647 – showdev Apr 19 '13 at 17:56

3 Answers3

1

In browsers other than Internet Explorer — and maybe in IE9 — it's overflow-wrap.

<td style="overflow-wrap: break-word">

You could try both styles. edit Try -ms-word-wrap for IE9.

Pointy
  • 405,095
  • 59
  • 585
  • 614
  • Neither of those are working sorry. Might have to be javascript – Zuno Dec 16 '12 at 17:36
  • Unfortunately my page appears to be broken then! The cell didn't have a width specified, so I specified one, then used overflow:hidden;word-wrap: break-word;-ms-word-wrap: break-word;overflow-wrap: break-word; and still no joy. I even removed the space between Bcc: and the email address - just made the cell wider to accommodate the whole lot. This is sending me nuts!!! – Zuno Dec 16 '12 at 18:18
0

Try giving the td a fixed width and then putting the contents inside a div with the styling applied. Ex:

<td style="width:300px;">
    <div style="width:300px;overflow-wrap:break-word;">
        <?php echo $Privacy; ?> 
        <span><?php echo $Email; ?></span> 
        <button class="copy">COPY</button>
    </div>
</td>
joshuahedlund
  • 1,722
  • 2
  • 20
  • 25
0

I put my label in a div and give it style it works finnally 

<div style="word-wrap: normal; word-break: break-all;">
<asp:Label ID="Label2" runat="server" Text='<%# Bind("REASON") %>'></asp:Label>
</div>
Ebtsam
  • 1
  • 1