Sounds interesting, right? ツ
Normally, it is used to put your Search Box aligned to your header banner but you really need to have a Trial and Error Method for you have the perfect position of your Widget/Gadget.
But don't worry, the process are very simple! ツ
1st. You need to Locate The Widget/GadgetID#
(just click the link above to know how...)
2nd. go to Design-->Template Designer-->Advanced--> Add CSS--> Input one of the codes below:
This is for basic text alignment. Replace the Orange with center, left, or right
This is for a more precise alignment.You can use Padding & Margin
You can also use a code like this to fit your needs.
This would display your gadget 100px off the left side of your browser screen and 150px off the top. You can adjust this to your liking.
Their are a few different types of positioning variables you can use.
absolute: Generates an absolutely positioned element, positioned relative to the first parent element that has a position other than static. The element's position is specified with the "left", "top", "right", and "bottom" properties
fixed: Generates an absolutely positioned element, positioned relative to the browser window. The element's position is specified with the "left", "top", "right", and "bottom" properties
relative: Generates a relatively positioned element, positioned relative to its normal position, so "left:20" adds 20 pixels to the element's LEFT position
static: Default. No position, the element occurs in the normal flow (ignores any top, bottom, left, right, or z-index declarations)
inherit: Specifies that the value of the position property should be inherited from the parent element
SOURCE