CODEWITHSUNDEEP
c#asp.net
user710502
user710502

Reputation: 11469

How to make a link to break in a paragraph

I ahve this code in asp that has a paragraph and a link in it. The issue is that the link that its getting is super long so it braks the design of the page, is there anyway to make it look like in a box (like if it had a line break). To be more specific I have a link that looks like this

http://www.google.com/cewcexxwrfrgregrfref/rferfrefrferfrefrf_jerfreferfrefrefrefrefrefer_freferfwrfwefewfewfwefewfwefefwefewfwefewf909ew0fwefwefwefwefwefwefwefwefewfwefewffwefwefwefwef99we0fwef__________________fwefwefewfewfw45453rwefwef

I want it to look something similar to this so that it doesnt break my page.

            http://www.google.com/cewcexxwrfrgregrfref/
            rferfrefrferfrefrf_jerfreferfrefrefrefrefrefer_
            freferfwrfwefewfewfwefewfwefefwefewfwefewf909e
            w0fwefwefwefwefwefwefwefwefewfwefewffwefwefwefwef99we0f
            wef__________________fwefwefewfewfw45453rwefwef

Here is the code

 <h4 class="SubTitle">
 Follow our Instructions</h4>
 <p>
   The instructions can be found in several places but we recommend:
     <br />
       <asp:LinkButton ID="lnkUrl" runat="server" Width="100px"></asp:LinkButton>
 </p>

Upvotes: 0

Views: 227

Answers (3)

Erick Petrucelli
Erick Petrucelli

Reputation: 14902

Use the CSS word-wrap attribute, this way:

a { display: block; word-wrap: break-word; }​

You can see it working here. So, in your code it could be:

<h4 class="SubTitle">Follow our Instructions</h4>
<p>
    The instructions can be found in several places but we recommend:
    <br />
    <asp:LinkButton ID="lnkUrl" runat="server" Style="display: block; word-wrap: break-word; width: 100px;"></asp:LinkButton>
 </p>

Upvotes: 1

Nudier Mena
Nudier Mena

Reputation: 3274

 I think this might work, apply this css class to your link
 <head>
 <style type="text/css">
 .nobreak{display:inline;}
 </style>
 </head>

 <h4 class="SubTitle">
  Follow our Instructions</h4>
  <p>
   The instructions can be found in several places but we recommend:
   <br />
  <asp:LinkButton cssClass="nobreak" ID="lnkUrl" runat="server" Width="100px">    </asp:LinkButton>
</p>

Upvotes: 0

Matt Hudson
Matt Hudson

Reputation: 7348

You should put it in a div with width. The browser will automatically wrap it for you.

<p>
   The instructions can be found in several places but we recommend:
</p>
<div style="width: 100px;">
<asp:LinkButton ID="lnkUrl" runat="server" Width="100px"></asp:LinkButton>
</div>

Upvotes: 0

Related Questions