Align Widgets

Their many ways to align widgets. Now depending on what type of widget it is  you will have to use a different method.

If you have access to the HTML code of the widget such as a HTML/javascript gadget you can simply use one of these methods below inside the gadget its self.


<center>YOU HTML CODE</center>
<right>YOU HTML CODE</right>
<left>YOU HTML CODE</left>

Now you don't always have access to the HTML code like with AdSense gadgets or  Link List gadgets. So to do this you will need to give the gadget a unique name. For now lets just name it Tweak and then save it.

(If your using a Adsense gadget you can not change the title field, so just skip this step.)

Now you will need to go to the  Edit HTML page.

Once you are on this page click Ctrl+F and a text bar will pop up. Type Tweak in the text bar.

(Type Adsense if your using  a adsense gadget)

This will highlight Tweak  with in the HTML coding.  Once you have found it you may see something like this below.

(If your trying to center a AdSense gadget you may have to hit next on the text bar till you find the one your looking for. You can figure this out by the order you added the gadgets or by the column you put it in.)


      <div id='sidebar-wrapper'>
        <b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='HTML3' locked='false' title='' type='HTML'/>
<b:widget id='AdSense1' locked='false' title='' type='AdSense'/>
<b:widget id='LinkList1' locked='false' title='Tweak' type='LinkList'/>
<b:widget id='LinkList2' locked='false' title='Example' type='LinkList'/>
</b:section>

Now you can choose to align everything in this column or just the individual gadget.

To align everything in this column add one of these codes below just after the column ID.


style='text-align:right'
style='text-align:center'
style='text-align:left'

Example:


      <div id='sidebar-wrapper' style='text-align:center'>
        <b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='HTML3' locked='false' title='' type='HTML'/>
<b:widget id='AdSense1' locked='false' title='' type='AdSense'/>
<b:widget id='LinkList1' locked='false' title='Tweak' type='LinkList'/>
<b:widget id='LinkList2' locked='false' title='Example' type='LinkList'/>
</b:section>

Now if you just want to align the widget its self then add it at the end of the widget ID line.

Example:


<div id='sidebar-wrapper' >
        <b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='HTML3' locked='false' title='' type='HTML'/>
<b:widget id='AdSense1' locked='false' title='' type='AdSense' style='text-align:center'/>
<b:widget id='LinkList1' locked='false' title='Tweak' type='LinkList'/>
<b:widget id='LinkList2' locked='false' title='Example' type='LinkList'/>
</b:section>