Footer Customization Questions

hi.

thanks so much for all your help so far. i’m just starting to customize my footer and i’m running into some issues.

you can find the page i’m editing here:
cindyworkman.com

After a lot of fiddling around using both images and/or text inside a text widget in my footer, i’ve settled on using one image (dots and copyright line) – which is what you currently see on the example page.

when i only enter in text, it works correctly and the content is vertically aligned, but as you can see using only an image there’s more space below the image than above. how would i adjust this?

Additionally, i’d like this image to be right aligned with 21px of space on the right side. currently there’s pretty big gap there and i can’t figure out why?

also when i make my browser window smaller, the height of the footer increases so it’s huge. how can i retain the height it is when the browser window is expanded (~42px)?

and fyi: the footer’s been set to be ‘sticky’.

here’s the css i currently have – which did adjust the height of the footer and somewhat get the image to the right side:

/*changing the padding on the footer*/
#footer {
padding: 0 !important;
}

/*right aligning the footer text widget*/
#footer .widget .textwidget {
text-align: right !important;
}

/*making the footer sticky*/
#footer {
position: fixed;
width: 100%;
bottom: 0;
z-index: 10000;
}

and lastly, the footer is overlapping my content. How can i set this up so that it appears below the last color section in my page content? e.g. so they abut – share a common edge rather than on overlap?

thanks in advance for all your help.

cheers-

cindy