want to insert colored text into wysiwig freetextbox without line break

Question

User646364117 posted

I am inserting text into a freetextbox control. I am using a div to apply a color style. the div is causing a line break. How do I avoid this?

here is my code

 TIA

Protected Sub btnFirstName_Click(sender As Object, e As EventArgs) Handles btnFirstName.Click
        Dim ExistingText As String = ftb1.Text
        Dim insertthis As String
        insertthis = "<div style='color:green;'>" & txtFirstName.Text & "</div>"
        'If there is a ^, do insert there, else do at end
        Dim posLocator As Integer = InStr(ExistingText, "^")
        If posLocator = 0 Then
            ftb1.Text = ExistingText & " " & insertthis
        Else
            Dim textArray() As String = Split(ftb1.Text, "^")
            ftb1.Text = textArray(0) & "&nbsp;"  & insertthis & "&nbsp;" & textArray(1)

        End If

    End Sub

Answer 1

User475983607 posted

sg48asp

I am inserting text into a freetextbox control. I am using a div to apply a color style. the div is causing a line break. How do I avoid this?

That makes sense since a <div> is a block element.  Use a inline element like a <span> instead.

https://stackoverflow.com/questions/183532/what-is-the-difference-between-html-tags-div-and-span

Answer 2

User-1330468790 posted

Hi, sg48asp,

 

Actually @mgebhard is right that the "<div>" is a block element. You should be careful about the difference between inline element and block element since it will help you to construct html page easier.

 

However, there is another way to make the div element listed inline by adding a style property "display: inline".

More details, please refer to below example:

HTML:

<form id="form1" runat="server">
        <div>
            <div >
                <label>First element in div </label>
                <input type="button" value="Second element in div" />
                <div style="display: inline"><input type="button" value="An element in nested div" /></div>
                <div ><label>I am another div without inline property</label></div>
            </div>
        </div>
    </form>

Rendered page:

 

Hope this can help you.

Best regards,

Sean