0

Currently I have a stackpanel with 2 buttons which I have placed in a single row whithin my grid. I want to draw a border around the stackpanel, but the stackpanel is filling the whole row, it doesnt stop at the last button (as expected I suppose):

Image of border around stackpanel

How can I modify this so the stackpanel or border stops at the last element without hardcoding or dynamically calculating a bottom margin?

<Border Background="#FF303841"
                Margin="5"
                CornerRadius="3"
                Grid.Row="2"
                Grid.Column="4">
            <StackPanel>
                <TextBlock Text="OTHER"
                           Foreground="White"
                           FontWeight="Medium"
                           FontFamily="Poppins"
                           FontSize="16"
                           HorizontalAlignment="Left"
                           Margin="5,5,0,0"/>
                
                <Button Style="{StaticResource linkBtn}">TEST1</Button>
                <Button Style="{StaticResource linkBtn}">TEST2</Button>

            </StackPanel>
        </Border>
ArcFlash
  • 1
  • 2
  • Does this answer your question? [Wpf control size to content?](https://stackoverflow.com/questions/1746431/wpf-control-size-to-content) – Ibrennan208 Jun 27 '22 at 22:03
  • Oh that seems like an obvious setting I missed, but doesnt seem to work for me. I added Height="Auto" to both the border and stackpanel, but it still goes right to the end of the container, doesnt stop at the last button. – ArcFlash Jun 27 '22 at 22:31
  • If I set my Row to Height="Auto" that kind of works, but then it sets the height of all stackpanels in that row to the tallest stackpanel... I have multiple seperate stackpanels in the row, so its the stackpanels which I need to be auto re-sizing, not sure why the height attribute did nothing... – ArcFlash Jun 27 '22 at 22:33
  • Another way is to set `VerticalAlignment="Top"` in that Border. – emoacht Jun 27 '22 at 22:53
  • Wow that worked, not intuitive to me as I would have thought that makes sure the control starts from the top, but anyway it works, thank you! – ArcFlash Jun 27 '22 at 23:29
  • The default value of `VerticalAlignment` is Stretch and you can stop the Border being stretched by setting another value. – emoacht Jun 28 '22 at 03:20
  • Oh I see, understood, thanks for taking the time to explain! – ArcFlash Jun 28 '22 at 23:21

1 Answers1

0

As per emoacht's comment above, the solution was to simply add VerticalAlignment="Top" to the border. That made it stop filling the parent which was the grid row.

The cause of this behavior is that the default parameter for VerticalAlignment is stretch, so it needs to be overridden.

ArcFlash
  • 1
  • 2