html - Float CSS Badge next to each other I guess I want to float -

i know how float badges next each other in footer menu. have 4 badges far six. badges ssl, avg, bbb, etc... very new website building stuff. use joomla 3.1 , use paid date template. can see codes , add badges pop on top of each other. had 1 person me did in tables , told me work not right way it. please remember when helping me child learning color first time when comes :) any 1 able give.

if @ bottom of page( http://www.jcluforever.com/j-adore-god-christian-t-shirt-p/ts-jdrgod-prp.htm )that badges have payment, ssl, , front; how want line mine in footer , have 5 adding idea of have https://www.paypal.com/webapps/mpp/paypal-popup','wipaypal','toolbar=no, location=no, directories=no, status=no, menubar=no, scrollbars=yes, resizable=yes, width=1060, height=700'); return false;">

next 1 be

<div id="avgthreatlabs_safetybadge_small"><noscript><a href="http://www.avgthreatlabs.com?utm_source=h&utm_medium=na&utm_campaign=ssbw" target="_blank">avg threatlabs</a></noscript></div><script language="javascript" src="https://api.avgthreatlabs.com/static/js/security_s.js"></script> 

next be

<!--- not edit - globalsign ssl site seal code - not edit ---><table width=130 border=0 cellspacing=0 cellpadding=0 title="click verify: site uses globalsign ssl certificate secure personal information." ><tr><td><span id="ss_img_wrapper_110-55_flash_en"><a href="http://www.globalsign.com/" target=_blank title="ssl"><img alt="ssl" border=0 id="ss_img" src="//seal.globalsign.com/siteseal/images/gs_noscript_110-55_en.gif"></a></span><script type="text/javascript" src="//seal.globalsign.com/siteseal/gs_flash_110-55_en.js" ></script><br /><a href="http://www.globalsign.com/" target=_blank  style="color:#000000; text-decoration:none; font:bold 8px arial; margin:0px; padding:0px;">globalsign ssl certificates</a></td></tr></table><!--- not edit - globalsign ssl site seal code - not edit ---> 

and on , on until place badge want or can or need to. not sure part of template need short or called less told

best practice have these badges nested in unordered list. each badge inside of list item. example, let's each badge image. try this:

<ul class="my-list"> <li><img src="1.jpg"></li> <li><img src="2.jpg"></li> <li><img src="3.jpg"></li> <li><img src="4.jpg"></li> </ul> 

then, in stylesheet, write:

.mylist {    list-style:none; }   .mylist li {     float:left; } 

this float items left of page , "stack" list items beside each-other, instead of on top of each-other.