Merhaba arkadaşlar, aşağıda verdiğim html kodu footere sabitleniyor ve footer alanında benim koyduğum bir bar olduğu için birbirlerine karışıyorlar yani kötü bir görünüm oluşuyor.

Bu kodun footerde 10PX falan yukarıda durmasını nasıl sağlarım?

                <center><div id="menucon"><div id="koddostu-tex"><br/><b>DUYURU!</b><br/><br/>

Bilgilendirme;

<br/><br/>

Duyuru içerik.

</div></div>
<koddostu><style> #menucon{ position:fixed; bottom:10px; left:10px; width:130px;height:130px; background:transparent url(http://4.bp.blogspot.com/-d2P6c2gUTZs/UpPBn2rpnnI/AAAAAAAAi3w/fOfywJXwJ5g/s1600/see.png) no-repeat center center; transition: all 0.8s ease-in-out; background-size:cover; -webkit-transition: all 0.8s ease-in-out; transition-timing-function:ease-in-out; -webkit-transition-timing-function:ease-in-out; } #menucon:hover{ bottom:35px;left:35px; width:80px;height:80px; transform: rotate(720deg); -ms-transform: rotate(720deg); -webkit-transform: rotate(720deg); }#koddostu-tex{position:absolute;bottom:37px;left:38px; box-shadow: -1px 1px 5px 0px #888888; transition: all 0.8s ease-in-out; -webkit-transition: all 0.8s ease-in-out; transition-timing-function:ease-in-out; line-height:22px; -webkit-transition-timing-function:ease-in-out; opacity:0; width:0px;height:0px; padding:6px;color:#fff; font-family:Helvetica, Arial, sans-serif; font-weight:normal; text-decoration:none; font-size:14px; text-align:center; -webkit-border-radius: 8px; -webkit-border-bottom-left-radius: 0; border-radius: 8px; border-bottom-left-radius: 0; }</style><script src="http://kdostu.googlecode.com/svn/cquery.js"></script><style> #menucon:hover #koddostu-tex{ width:200px;height:250px; background:#444; opacity:0.6;} </style></koddostu></center>