[SOLVED] Beautiful footer
Sorry for bad English
Help please
I'm trying to simulate a footer site
But I have problems
This is my site
wordpress-2.9.2
Atahualpa - version 3.5.2
Use the settings
PHP Code:
<footer><div id="footer-inner"><section id="things-i-do"><div class="thing-i-do">
<a href="http://wufoo.com"><h5>I work for...</h5><div id="thing-wufoo">Wufoo is an online form builder that makes building even the most complex forms
so easy, it's fun!</div> </a></div><div class="thing-i-do">
<a href="http://digwp.com"><h5>Book I co-authored...</h5><div id="thing-digwp">Digging Into WordPress is a book and blog I co-author with Jeff Starr about the world's #1 publishing platform.</div> </a></div>
<div class="thing-i-do"> <a href="http://quotesondesign.com"><h5>Words I collect...</h5><div id="thing-qod">Quotes on Design is a collection of design related quotes. With an API for your integration ideas!</div>
</a></div></section><div id="author-footer"><h4>About the Author</h4><p>
<a href="http://chriscoyier.net">Chris Coyier</a> is a web designer living
in Tampa, FL. He loves old time fiddle music, episodic television,
building <a href="http://html-ipsum.com/">little useful websites</a>, and <a href="/bookshelf/">tech books</a>.
You may <a href="/contact/">contact him</a>.</p><p id="social-icons">
<a id="icon-delicious" href="http://delicious.com/chriscoyier">Delicious</a>
<a id="icon-twitter" href="http://twitter.com/chriscoyier">Twitter</a>
<a id="icon-flickr" href="http://www.flickr.com/photos/chriscoyier/">Flickr</a>
<a id="icon-forrst" href="http://forrst.com/people/chriscoyier/posts">Forrst</a> <a id="icon-facebook" href="http://www.facebook.com/CSSTricks">Facebook</a>
<a id="icon-grooveshark" href="http://listen.grooveshark.com/#/user/chriscoyier/">Grooveshark</a></p>
<h4>Subscribe!</h4><ul id="subscribe-list"><li><a href="http://feeds.feedburner.com/CssTricks">Articles Feed</a></li>
<li><a href="http://feeds.feedburner.com/CSS-TricksSnippets">Snippets Feed</a></li>
<li><a href="http://feedburner.google.com/fb/a/mailverify?uri=CssTricks&loc=en_US">Posts by Email</a></li>
<li><a href="http://feeds.feedburner.com/CSS-Tricks-Forums">Forums Feed</a></li>
<li><a href="http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewPodcast?id=273881728">iTunes Large</a></li>
<li><a href="http://itunes.apple.com/WebObjects/MZStore.woa/wa/viewPodcast?id=299818542">iTunes Mobile</a></li>
<li><a href="http://feeds.feedburner.com/CSS-Tricks-Screencasts">Screencast Large</a></li>
<li><a href="http://feeds.feedburner.com/CSS-Tricks-Screencasts-iPhone">Screencast Mobile</a></li></ul></div></div></footer>
CSS
PHP Code:
footer {
background: url(http://cdn.css-tricks.com/wp-content/themes/CSS-Tricks-7/images/css-tricks.png) no-repeat -10px -1254px;
background-image: url(http://cdn.css-tricks.com/wp-content/themes/CSS-Tricks-7/images/css-tricks.png);
background-repeat-x: no-repeat;
background-repeat-y: no-repeat;
background-attachment: initial;
background-position-x: -10px;
background-position-y: -1254px;
background-origin: initial;
background-clip: initial;
background-color: initial;
height: 276px;
position: relative;
width: 100%;
}
article, aside, figure, footer, header, hgroup, menu, nav, section {
display: block;
}
* {
margin: 0px;
margin-top: 0px;
margin-right: 0px;
margin-bottom: 0px;
margin-left: 0px;
padding: 0px;
padding-top: 0px;
padding-right: 0px;
padding-bottom: 0px;
padding-left: 0px;
}
article, aside, footer, header, hgroup, nav, section {
display: block;
}
Inherited from body.home.blog
body {
color: #41403F;
font: normal normal normal 13px/1.3 Verdana, 'Lucida Grande', Arial, Helvetica, sans-serif;
orphans: 2;
}
Pseudo ::selection element
::selection {
background: #FFCC89;
background-image: initial;
background-repeat-x: initial;
background-repeat-y: initial;
background-attachment: initial;
background-position-x: initial;
background-position-y: initial;
background-origin: initial;
background-clip: initial;
background-color: #FFCC89;
color: #222;
}
Threaded Mode