7 Replies - 842 Views - Last Post: 28 March 2013 - 12:34 AM

#1 mitkram  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 7
  • Joined: 18-March 13

How to set border to div element for text formatting?

Posted 24 March 2013 - 10:57 AM

Hi, I'm working a comment section page where it allows the user to leave a comment. I need assistance in my layout for displaying the comments into the repeater control. I used to put the comments inside the div element of the item and alternatingitem template of the repeater. And as a result, the comment would go straight along the line in the div element if the user is typing too many words or paragraph. What I want is to put a limit where the text will stop and proceed to the next line of the div element. How would I do that?What is the best way?Any suggestion? Here's my layout for the repeater control where I used to insert the comments.

<asp:Repeater ID="Repeater1" runat="server" DataSourceID="SqlDataSource1">
        
        <HeaderTemplate>
  </HeaderTemplate>
  
  <ItemTemplate>
  
  <tr>
  <td >
   <div style="background-color:#FFFF66" >
    <%# Eval("Name") %> Says...
    <%# Eval("Comments") %>
    </div>
    </td>
 </tr>
 
  </ItemTemplate>
  
  
 
  <AlternatingItemTemplate>
  
   <tr>
  <td >
  <div style="background-color:#CCFF33" >
       <%# Eval("Name")%> Says...
  <%# Eval("Comments")%>
  </div>
  </td>
 </tr>
 
  </AlternatingItemTemplate>
  
  <SeparatorTemplate >
   <br />
   
  </SeparatorTemplate>
  
  <FooterTemplate>
  </FooterTemplate>
        
        </asp:Repeater>


Is This A Good Question/Topic? 0
  • +

Replies To: How to set border to div element for text formatting?

#2 andrewsw  Icon User is online

  • Fire giant boob nipple gun!
  • member icon

Reputation: 2886
  • View blog
  • Posts: 9,583
  • Joined: 12-December 12

Re: How to set border to div element for text formatting?

Posted 24 March 2013 - 11:11 AM

DIVs don't have lines. Specify a width for the div, and the height should expand to contain the text.

If the div is editable and you are using it to allow the user to create a comment, then you'll need to set a height as well.

This post has been edited by andrewsw: 24 March 2013 - 11:13 AM

Was This Post Helpful? 0
  • +
  • -

#3 mitkram  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 7
  • Joined: 18-March 13

Re: How to set border to div element for text formatting?

Posted 24 March 2013 - 11:59 AM

I tried to set its height but only the height will change. I'm trying to put a limit to comments being entered where
it will automatically jump to a new line when reaching its boundery being set to. So, if Divs has no next line what
is the best way to use?
Was This Post Helpful? 0
  • +
  • -

#4 andrewsw  Icon User is online

  • Fire giant boob nipple gun!
  • member icon

Reputation: 2886
  • View blog
  • Posts: 9,583
  • Joined: 12-December 12

Re: How to set border to div element for text formatting?

Posted 24 March 2013 - 12:53 PM

View Postmitkram, on 24 March 2013 - 06:59 PM, said:

I tried to set its height but only the height will change. I'm trying to put a limit to comments being entered where
it will automatically jump to a new line when reaching its boundery being set to. So, if Divs has no next line what
is the best way to use?

I suggested changing the width, not the height. I only suggested also changing the height if the DIV is editable.

You haven't clarified (particularly as I, personally, don't use ASP); are the DIVs editable so that they are for the user to create a comment? Or are they used to display comments retrieved from a database?
Was This Post Helpful? 0
  • +
  • -

#5 mitkram  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 7
  • Joined: 18-March 13

Re: How to set border to div element for text formatting?

Posted 24 March 2013 - 01:19 PM

yes,they are used to display comments retrieved from a database.Do you know how to wrap words using css?

I made several times changing the width of the div element but still the same output,not being wrapped up.
Was This Post Helpful? 0
  • +
  • -

#6 andrewsw  Icon User is online

  • Fire giant boob nipple gun!
  • member icon

Reputation: 2886
  • View blog
  • Posts: 9,583
  • Joined: 12-December 12

Re: How to set border to div element for text formatting?

Posted 24 March 2013 - 01:24 PM

Well, setting a width would normally cause a div to expand vertically to fit its content. You might try overflow: visible; or overflow: auto; as maybe the div behaves differently if it already exists or is created dynamically.

Sorry if this doesn't help. Andy.
Was This Post Helpful? 0
  • +
  • -

#7 mitkram  Icon User is offline

  • New D.I.C Head

Reputation: 0
  • View blog
  • Posts: 7
  • Joined: 18-March 13

Re: How to set border to div element for text formatting?

Posted 24 March 2013 - 01:56 PM

Using overflow:auto will give a horizontal scroll bar but it's not breaking the words into new lines inside the div element.
Was This Post Helpful? 0
  • +
  • -

#8 Dormilich  Icon User is online

  • 痛覚残留
  • member icon

Reputation: 3397
  • View blog
  • Posts: 9,607
  • Joined: 08-June 10

Re: How to set border to div element for text formatting?

Posted 28 March 2013 - 12:34 AM

simply (but grammatically incorrect) breaking words at the end of the line can be done with CSS3s word-wrap property.

for a grammatically correct word breaking you need to insert soft hypens (&shy;) into your words (then it automatically breaks the words). this can also be automated by Java​Script (e.g. the Hyphenator library).
Was This Post Helpful? 0
  • +
  • -

Page 1 of 1