XML / Anchors Anchors holds a list of Anchor elements , and is a fundamental UI building block for defining positional layout for LayoutFrame UI elements . Anchors can be defined on any LayoutFrame , including Frames , Textures , and FontStrings . Inheritance . Inherited by : none , Inherits : none , Defined in : LayoutFrame Elements . « a href = " XML / Anchor " > Anchor < / a » . . . Attributes . none Summary . Anchors are the primary ' Layout ' mechanism in the WoW UI , which along with the « a href = " XML / Dimension " > Size < / a » element , allow WoW to position all of its visible and interactive elements on the screen , including the 3D views of the world . Anchors works by defining a list of « a href = " XML / Anchor " > Anchor < / a » elements each of which provide a detail about how a LayoutFrame should either be positioned or sized , or both . If Anchors does not provide enough information to completely define a LayoutFrame ' s size , then the Size element is used . The anchors themselves work by defining a point on the containing LayoutFrame to position and a point on another LayoutFrame to position it relative to . The cumulative effect of all the anchors in the Anchors list , combined with the size , help determine the final postion for a LayoutFrame at runtime . Example . < Frame name = " MyFrame " > This example will align the top of the ' child ' frame to the top of ' MyFrame ' , and then offset that alignment by - 22 vertically . Details . Anchors define position and size of a layout element relative to other layout frames . You can define one or more " anchor " tags within " anchors " element . Each anchor has several attributes : If two or more anchors are defined they can override the size , so element size will depend on the size of its parent . Each widget got only four borders : For each border type there are two ways of defining size and position : If undefined for both border types ' hook ' is placed in center relative to its parent element center with zero offset and size equals to parent element size . Each anchor defined overrides one border rule . When ' hook ' placed left or right it removes center ' hook ' . When center ' hook ' placed it removes ' left ' and ' right ' hooks if defined . Two borders type are separate , so horizontal size can be defined by one ' hook ' and size , when vertical defined by two ' hooks ' . TOPLEFT anchors should be processed as two anchors TOP anchor and LEFT anchor with all other properties same . Same for BOTTOMLEFT , TOPRIGHT , BOTTOMRIGHT . You can think about them just as shorter form of writing . CENTER anchor affects both border types . Widget can be relative only to one other element . So each anchor with relativeto attribute defined changes it . Will put ' hook ' to left - middle part of widget and fix it to left - middle part of parent widget with zero offset makes left part of widget fixed to right part of parent while top of parent will be middle of widget Widget top remains same as top of parent , when left of widget goes to left of " One " Element will be fixed to center of its parent When element is inherited from another one and both got anchors defined , inherited processed first , then widget ones , so ones you override template anchors . For all this size is taken from Size tag .