CSS-Überlauf mit langer URL

Question

Ok, also habe ich Google-Anzeigen in einem 160x600 Container. Neue Anzeigen werden beim Aktualisieren zufällig angezeigt. Wenn eine Anzeige mit einer langen URL angezeigt wird, die keine Bindestriche oder Zeichen enthält, für die sie unterbrochen werden soll, wird ein Überlauf aus dem Container-Div ausgeführt. Gerade jetzt habe ich einen Überlauf: so versteckt alles nach 160 Pixeln versteckt. Das Problem ist, dass bei einer langen URL ein Teil davon ausgeblendet wird (was gut ist), aber der Text über der Anzeige wird auch ausgeblendet, anstatt zu brechen, weil sie horizontal so weit fließt, wie die URL geht.

Wie mache ich den Text konform und umbruch mit 160 Pixel, obwohl ich die URL nicht darunter wickeln kann?

Danke!

Answer 1

Sie könnten die URL immer in ein separates DIV setzen und dann den DIV-Überlauf auf hidden setzen.

Answer 2

Ich glaube nicht, gibt es einen sauberen CSS Weg, dies zu fixieren: http://www.w3schools.com/Css/pr_pos_overflow.asp

Um das Problem zu beheben Sie die URL in seinem eigenen div setzen und die Überlauf-Eigenschaft ausgeblendet werden. Das verbietet es der URL, außerhalb des Containers zu gehen, Mutter, ich bin mir nicht sicher, ob du das willst.

Wenn Sie mit PHP ich das gefunden, die Ihren Text Silbentrennung kann:

$t = preg_replace("/>(([[:alnum:]]+:\/\/)¦www\.)([^[:space:]]". 
"{30,40})([^[:space:]]*)([^[:space:]]{10,20})([[:alnum:]#?\/&=])". 
"</", ">\\1\\3...\\5\\6<", $t); 

(von http://www.webmasterworld.com/forum83/5762.htm)

bearbeiten: auch die kühle word-wrap CSS-Eigenschaft, aber es hat werden von den meisten aktuellen Browsern nicht behandelt.

Hoffnung, die

---

auch hilft, ist diese Art von einem Duplikat: Using CSS, how can I split a string (e.g. a long URL) in a table cell?

Answer 3

Für Browser whichsupportit, word-wrap: break-word ;.