Inline wrapping of hyperlink text in HTML anchor tag

Issue

I’m trying to find a way to allow really long text in an HTML link to wrap while containing the link in a compact rectangle.

Essentially, I want this:

                      with a really, really
    Here is some text long link that wraps   and here is some more text.
                      around in a rectangle

Instead of:

   Here is some text with a really, really long link that wraps
   around in a rectangle and here is some more text.

How can I do this?

Solution

You can do it like this in Firefox – it doesn’t work in IE though 🙁

<p>Here is some text <a href="#">with a really, really long link that wraps</a> around in a rectangle and here is some more text.


<style type="text/css">

a {display: inline-block; max-width: 100px; vertical-align: middle;}

</style>

Answered By – Greg

This Answer collected from stackoverflow, is licensed under cc by-sa 2.5 , cc by-sa 3.0 and cc by-sa 4.0