# TextEdit Styling

**URL:** <https://forums.fusetools.com/t/textedit-styling/671>\
**Category:** How-to Discussions\
**Created:** [February 28, 2016, 8:40pm UTC](https://forums.fusetools.com/t/textedit-styling/671 "2016-02-28T20:40:42Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![sunny](https://avatars.discourse-cdn.com/v4/letter/s/7c8e57/32.png) [@sunny](https://forums.fusetools.com/u/sunny)\
**Post date:** [February 28, 2016, 8:40pm UTC](https://forums.fusetools.com/t/textedit-styling/671/1 "2016-02-28T20:40:42Z")

</div>

Hello,

I have been reading Fuse for a few days and have finally decided to test some features by building a simple form with customized UI styling. So Instead of using TextInput, I am using TextEdit.

However I am not able to type anything in the edit box or add a place holder text, What am I doing wrong? Here’s the code:

```auto
<App>
    <Rectangle Width="350" Height="27" Alignment="Center" Background="#E5FFB3">
        <TextEdit TextColor="#000" PlaceholderColor="#000" TextAlignment="Center" FontSize="22" Height="25" Value="Hello World" Width="348" PlaceholderText="Hello World">
        </TextEdit>
        <Stroke Width="3">
            <SolidColor Color="#CCC" />
        </Stroke>
    </Rectangle>
</App>

```

---

<div class="post-metadata">

**Author:** ![Anders\_Lassen](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/anders_lassen/32/522_2.png) [@Anders\_Lassen](https://forums.fusetools.com/u/Anders_Lassen)\
**Post date:** [February 28, 2016, 9:21pm UTC](https://forums.fusetools.com/t/textedit-styling/671/2 "2016-02-28T21:21:04Z")

</div>

Hi!

`TextEdit` is completely plain, so it does not support `PlaceholderText`. You can however implement your own like this:

```auto
<TextEdit>
    <Text ux:Name="placeholder">This is the placeholder</Text>
    <WhileContainsText>
        <Change placeholder.Visibility="Hidden" />
    </WhileContainsText>
</TextEdit>

```

Not sure why you can’t type anything, can you describe a bit more of what’s happening please?

---

<div class="post-metadata">

**Author:** ![sunny](https://avatars.discourse-cdn.com/v4/letter/s/7c8e57/32.png) [@sunny](https://forums.fusetools.com/u/sunny)\
**Post date:** [March 1, 2016, 1:30am UTC](https://forums.fusetools.com/t/textedit-styling/671/3 "2016-03-01T01:30:12Z")

</div>

I have integrated the placeholder code you suggested, but I still don’t see placeholder text. Also I am still not able to type anything in the Input field. Can you test the code?

```auto
<App>
    <Rectangle Width="350" Height="27" Alignment="Center" Background="#E5FFB3">
        <TextEdit TextColor="#000" PlaceholderColor="#000" TextAlignment="Center" FontSize="22" Height="25" Value="Hello World" Width="348" PlaceholderText="Hello World">
        <Text ux:Name="placeholder" TextColor="#000">This is the placeholder</Text>
        <WhileContainsText>
            <Change placeholder.Visibility="Hidden" />
        </WhileContainsText>
        </TextEdit>
        <Stroke Width="3">
            <SolidColor Color="#CCC" />
        </Stroke>
    </Rectangle>
</App>

```

---

<div class="post-metadata">

**Author:** ![Remi\_Pedersen](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/remi_pedersen/32/432_2.png) [@Remi\_Pedersen](https://forums.fusetools.com/u/Remi_Pedersen)\
**Post date:** [March 1, 2016, 8:42am UTC](https://forums.fusetools.com/t/textedit-styling/671/4 "2016-03-01T08:42:15Z")

</div>

The reason you don’t see the placeholder text is because you’ve set `Value="Hello World"` for TextEdit. In other words `WhileContainsText` is true. 🙂

The TextEdit is invisible because you haven’t set a [Theme](https://www.fusetools.com/learn/fuse#theme-themes) in the App tag. This is because TextEdit (just like TextInput) relies on native platform controls.

This should do the trick:

```auto
<App Theme="Basic">
    <Rectangle Width="350" Height="27" Alignment="Center" Background="#E5FFB3" HitTestMode="Children">
        <TextEdit TextColor="#000" TextAlignment="Center" FontSize="22" Height="25" Width="348" >
        <Text ux:Name="placeholder" TextColor="#000">This is the placeholder</Text>
        <WhileContainsText>
            <Change placeholder.Visibility="Hidden" />
        </WhileContainsText>
        </TextEdit>
        <Stroke Width="3">
            <SolidColor Color="#CCC" />
        </Stroke>
    </Rectangle>
</App>

```