# Wrapping text inside a StackPanel with Horizontal orientation

**URL:** <https://forums.fusetools.com/t/wrapping-text-inside-a-stackpanel-with-horizontal-orientation/5329>\
**Category:** How-to Discussions\
**Created:** [July 13, 2016, 11:15pm UTC](https://forums.fusetools.com/t/wrapping-text-inside-a-stackpanel-with-horizontal-orientation/5329 "2016-07-13T23:15:51Z")\
**Posts on this page:** 11\
**Page:** 1

<div class="post-metadata">

**Author:** ![ipek](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/ipek/32/369_2.png) [@ipek](https://forums.fusetools.com/u/ipek)\
**Post date:** [July 13, 2016, 11:15pm UTC](https://forums.fusetools.com/t/wrapping-text-inside-a-stackpanel-with-horizontal-orientation/5329/1 "2016-07-13T23:15:51Z")

</div>

Hi,

In this sample App, the long text is wrapped when it’s in a `StackPanel` with `Vertical` orientation. But when I change the `StackPanel` orientation to `Horizontal` the text is not wrapped anymore.

```auto
<App>
  <Text ux:Class="Medium" FontSize="20" TextWrapping="Wrap" TextColor="Blue" />

  <StackPanel>
    <StackPanel Background="#C7C7CC">
        <Medium>This is just some medium text, but it will happily wrap when the edges of the screen is reached.</Medium>
    </StackPanel>

    <StackPanel Orientation="Horizontal" Margin="0,40,0,0" Background="#C7C7CC">
        <Medium>This is just some medium text, but it will happily wrap when the edges of the screen is reached.</Medium>
    </StackPanel>
    </StackPanel>
</App>

```

As Bolav suggested I’ve set `<Medium Width="300">` and it worked. But still wanted to know whether this behaviour of StackPanel is normal or not.

Thanks in advance,

Ipek

---

<div class="post-metadata">

**Author:** ![Kristian\_Hasselknipp](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/kristian_hasselknipp/32/549_2.png) [@Kristian\_Hasselknipp](https://forums.fusetools.com/u/Kristian_Hasselknipp)\
**Post date:** [July 14, 2016, 9:23am UTC](https://forums.fusetools.com/t/wrapping-text-inside-a-stackpanel-with-horizontal-orientation/5329/2 "2016-07-14T09:23:00Z")

</div>

Hi!

This behavior is expected.

The reason is that when the StackPanel orientation is set to horizontal, is doesn’t know how wide you want your Text controls to be (since it theoretically could be infinite). When your StackPanel had a vertical orientation, the width was constrained by the screen width. This is not the case when you switch to horizontal orientation.

---

<div class="post-metadata">

**Author:** ![edA-qa\_mort-ora-y](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/eda-qa_mort-ora-y/32/124_2.png) [@edA-qa\_mort-ora-y](https://forums.fusetools.com/u/edA-qa_mort-ora-y)\
**Post date:** [July 14, 2016, 9:32am UTC](https://forums.fusetools.com/t/wrapping-text-inside-a-stackpanel-with-horizontal-orientation/5329/3 "2016-07-14T09:32:13Z")

</div>

Yes, this is the expected behaviour. A `StackPanel` provides infinite space in one direction, either vertically or horizontally. IN the vertical case you have a fixed width and infinite height, thus the text can be wrapped to the fixed width. In the horizontal case you have an infinite widht and fixed height. This doesn’t provide any width on which the text can wrap – it happily assumes it should write on one line since there’s no limit to that length.

---

<div class="post-metadata">

**Author:** ![ipek](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/ipek/32/369_2.png) [@ipek](https://forums.fusetools.com/u/ipek)\
**Post date:** [July 14, 2016, 9:35am UTC](https://forums.fusetools.com/t/wrapping-text-inside-a-stackpanel-with-horizontal-orientation/5329/4 "2016-07-14T09:35:12Z")

</div>

Thanks to both of you for the clear explanation.

---

<div class="post-metadata">

**Author:** ![Bjorn-Olav\_Strand](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/bjorn-olav_strand/32/583_2.png) [@Bjorn-Olav\_Strand](https://forums.fusetools.com/u/Bjorn-Olav_Strand)\
**Post date:** [July 14, 2016, 2:13pm UTC](https://forums.fusetools.com/t/wrapping-text-inside-a-stackpanel-with-horizontal-orientation/5329/5 "2016-07-14T14:13:24Z")

</div>

Can you please explain why

```auto
    <StackPanel MaxWidth="100%" Orientation="Horizontal" Margin="0,40,0,0" Background="#C7C7CC">
        <Medium>This is just some medium text, but it will happily wrap when the edges of the screen is reached.</Medium>
    </StackPanel>

```

renderes the background as if it is wrapping, but does not wrap the text.

---

<div class="post-metadata">

**Author:** ![edA-qa\_mort-ora-y](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/eda-qa_mort-ora-y/32/124_2.png) [@edA-qa\_mort-ora-y](https://forums.fusetools.com/u/edA-qa_mort-ora-y)\
**Post date:** [July 22, 2016, 9:06am UTC](https://forums.fusetools.com/t/wrapping-text-inside-a-stackpanel-with-horizontal-orientation/5329/6 "2016-07-22T09:06:51Z")

</div>

The `MaxWidth="100%"` makes the panel the width of the parent, and the background will fill only that area then. The Text is still free to overflow the container, since it’s width still isn’t constrained as it is a horizontal stack panel. It’s a bit of an odd scneario to have maximum width on a horizontal stack panel.

---

<div class="post-metadata">

**Author:** ![Freak](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/freak/32/541_2.png) [@Freak](https://forums.fusetools.com/u/Freak)\
**Post date:** [September 14, 2017, 12:05pm UTC](https://forums.fusetools.com/t/wrapping-text-inside-a-stackpanel-with-horizontal-orientation/5329/7 "2017-09-14T12:05:14Z")

</div>

Is there any method to display long text when the outer Stackpanel is horizontal?

---

<div class="post-metadata">

**Author:** ![Uldis](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/uldis/32/657_2.png) [@Uldis](https://forums.fusetools.com/u/Uldis)\
**Post date:** [September 14, 2017, 12:17pm UTC](https://forums.fusetools.com/t/wrapping-text-inside-a-stackpanel-with-horizontal-orientation/5329/8 "2017-09-14T12:17:57Z")

</div>

@Sajith: the above explanations fully cover the question you just asked.

---

<div class="post-metadata">

**Author:** ![Freak](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/freak/32/541_2.png) [@Freak](https://forums.fusetools.com/u/Freak)\
**Post date:** [September 14, 2017, 3:16pm UTC](https://forums.fusetools.com/t/wrapping-text-inside-a-stackpanel-with-horizontal-orientation/5329/9 "2017-09-14T15:16:55Z")

</div>

Yes, I got it, but I want to figure out Is it possible to fit long texts to narrow screens without giving “MaxWidth” or setting orientation to “Vertical”.

---

<div class="post-metadata">

**Author:** ![Uldis](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/uldis/32/657_2.png) [@Uldis](https://forums.fusetools.com/u/Uldis)\
**Post date:** [September 15, 2017, 8:59am UTC](https://forums.fusetools.com/t/wrapping-text-inside-a-stackpanel-with-horizontal-orientation/5329/10 "2017-09-15T08:59:06Z")

</div>

I’m not sure I can give you another answer aside what has already been said: for text to be wrapped, it has to be constrained by something. A horizontal `StackPanel` does not deliver those constraints since it’s infinite in the horizontal direction.

---

<div class="post-metadata">

**Author:** ![Freak](https://yyz1.discourse-cdn.com/flex035/user_avatar/forums.fusetools.com/freak/32/541_2.png) [@Freak](https://forums.fusetools.com/u/Freak)\
**Post date:** [September 15, 2017, 9:32am UTC](https://forums.fusetools.com/t/wrapping-text-inside-a-stackpanel-with-horizontal-orientation/5329/11 "2017-09-15T09:32:23Z")

</div>

OK . Thank you