Horizontally centering a rectangle in another rectangle

[Binary91]

Hi,

I’m trying to horizontally center a rectangle in a window. This is my code:

Window
{
visible: true
width: 400
height: 600

Rectangle
{
id: rectLayout
anchors.fill: parent

Rectangle
{
width: 90
height: 25
anchors.top: rectLayout.top
anchors.left: rectLayout.left
anchorrs.topMargin: 5
anchors.horizontalCenter: rectLayout.horizontalCenter
}
}
}

The wanted effect is a rectangle with top margin to the window of 5px and horizontally centered with a total width of 90 and height of 25 pixels.

The problem is, that using anchors.horizontalCenter: rectLayout.horizontalCenter results in streching the rectangle to the whole width of the window…

Does anybody know how I can avoid this effect?

Thank you in anticipation :-)

[wysota]

Your anchor definitions are contradictory. If you want to horizontally center an item, you cannot set its left anchor.

[Binary91]

Hi,
oh yes that was the problem! Thank you! :-)