0

For the xml below

<Image Width="30px" Height="30px" Margin="1 1 1 1" />

The margin is 1 1 1 1 but the image is at the centre of the screen (668 369 668 369). Why is this happening? Isn't the margin above invalid? Also, for the position of anything, you just need margin left and margin top. That's how winforms works, right? I don't understand why the Thickness constructer requires 4 values.

Sweeper
  • 213,210
  • 22
  • 193
  • 313
  • What is the parent Panel of the Image? E.g. a Grid might just center your Image, in which case the Margin would be useless. – Clemens Jul 23 '15 at 10:58

1 Answers1

1

A Thickness for a Margin is how many pixels from each edge of the element. These are Left, Top, Right, and Bottom.

Here's an example:

Margin="10,15,5,0"

The code above defines a margin of:

  • 10 Pixels from the Left.
  • 15 Pixels from the Top.
  • 5 Pixels from the Right.
  • 0 Pixels from the Bottom.

The margin is always defined as Left, Top, Right, Bottom. However there are some shortcuts.

For example:

Margin="10,15"

The margin here will be defines as:

  • 10 Pixels on the Left and Right.
  • 15 Pixels on the Top and Bottom.

And also:

Margin="15"

This margin will be 15 pixels on all sides.

To answer your question more directly, you are simply missing the commas.

Mike Eason
  • 9,525
  • 2
  • 38
  • 63
  • My point is that Margin="1, 1, 1, 1" doesn't even make sense because the Image is only 30px long, how can its left margin and right margin both equal to 1? Wouldn't this result in a compiler error or something? Instead, it centers the image. I just want to know why this happens. – Sweeper Jul 23 '15 at 12:27
  • The margin is relative to it's current **alignment**. You haven't set any values for `HorizontalAlignment`, and `VerticalAlignment`, so they have default values, which is `Stretch` (Meaning it will fill all available space). Try setting `HorizontalAlignment="Left"`, and `VerticalAlignment="Top"`. I can see you come from a HTML/CSS background, you do not need "px" in the `Width` and `Height` values. – Mike Eason Jul 23 '15 at 12:53