HTML: Yumuşak hipen (­) çizgi olmadan?

Question

Küçük bir düzen problemim var: Bir müşteri web sitesinde, insanların iletişim bilgilerini küçük bir kutuda gösteririz. Bu kutunun genişliği sınırlıdır. Olduğu gibi, çok uzun isimleri olan insanlar var (bu her şeyden önce Almanya'dadır ...) ve e-posta adresi verilen adın ve soyadın birleşimidir. Sonuç: belirli isimlerle, e-posta adresi, ilgili kutu tarafından verilen kısıtlamaları aşmaktadır.

takma böyle doğru bir satır sonu içinde @ sonuçları önce ­ ancak görünür:

john.doe- 
@example.com 

o çizgi bastırmak mümkün mü? <br /> kullanmak istemiyorum, çünkü isimlerin% 90'ı için kullanılabilir genişlik yeterli.

Answer 1

bu (muhtemelen oldukça iyi) çapraz tarayıcı nasıl yapar emin değilim rağmen, her zaman ince boşluk karakteri ( ) veya sıfır genişlikte boşluk ( ​) de kullanabilir. ⁺⁺

john.doe @example.com 

^{++ sıfır genişlikte boşluk ile göstermektedir, görünüşe göre bazı tarayıcılar doğru işlenmez olmaz} (source).

Answer 2

Css özelliği word-wrap'a bir göz atmak isteyebilirsiniz.

Ve this page istediğini yapıyor gibi görünüyor.

Answer 3

kullanın sıfır genişlikli alan: Burada eylem olarak ​

john.doe​@example.com 

: http://jsfiddle.net/uTXwx/1/