Problem with CSS on Wordpress
- by Tdasads
Hi there!
I'm trying to code my sidebar.php but it breaks and goes all the way down below the posts
PHP:
<!-- begin sidebar -->
<div id="menu">
<?php /* Widgetized sidebar, if you have the plugin installed. */
if ( !function_exists('dynamic_sidebar') || !dynamic_sidebar() ) : ?>
<label for="s">SEARCH</label>
<form id="searchform" method="get" action="#">
<div>
<input type="text" name="s" id="s" size="15" />
<br />
<input type="submit" value="TYPE HERE_" />
</div>
</form>
<div class="bg-sidebar">
<h2>MOST READ</h2>
<ul>
<li><a href="javascript:void(0);">Worth A Thousand Words</a></li>
<li><a href="javascript:void(0);">Feed Your Head</a></li>
<li><a href="javascript:void(0);">Aliquam tempus, eros commodo porta pretium</a></li>
<li><a href="javascript:void(0);">Pellentesque quis libero dui</a></li>
<li><a href="javascript:void(0);">Lorem ipsum dolor sit amet</a></li>
</ul>
<h2>RECENT POSTS</h2>
<ul>
<li><a href="javascript:void(0);">Worth A Thousand Words</a></li>
<li><a href="javascript:void(0);">Feed Your Head</a></li>
<li><a href="javascript:void(0);">Aliquam tempus, eros commodo porta pretium</a></li>
<li><a href="javascript:void(0);">Pellentesque quis libero dui</a></li>
<li><a href="javascript:void(0);">Lorem ipsum dolor sit amet</a></li>
</ul>
<h2>ARCHIVE</h2>
<ul>
<li>
<?php wp_get_archives('type=monthly'); ?>
</li>
</ul>
<h2>LINKS</h2>
<ul>
<li><a href="http://www.t.com">t</a></li>
<li><a href="http://www.tt.com">tt</a></li>
</ul>
</div>
<?php endif; ?>
</div>
CSS:
* { margin: 0; padding: 0; }
body, input { font-family: "Trebuchet MS"; font-size: 12px; }
.move { clear: both; height: 0; float: none !important; }
body { background: url(images/bg.gif); width: 991px; position: absolute; top: 0; left: 50%; margin: 0 0 0 -495px; padding: 0 0 71px 0; }
a { text-decoration: none; }
li { list-style: none; }
img { border: 0; }
#searchform { float: left; width: 366px; height: 27px; }
#searchform * { float: left;}
#searchform label { width:75px; height: 26px; border: solid 1px #ab0000; border-width: 1px 1px 0 0; text-align: center; line-height: 25px; font-weight: bold; font-size: 18px; color: #ab0000; background: white; }
#searchform p { border-bottom: solid 1px #ab0000; width: 290px; height: 25px; }
#searchform input { border: 0; margin: 6px 0 0 10px; display: inline; width: 234px; font-weight: bold; color: #999999; background: transparent; outline: none; height: 16px; }
#searchform button { background: url(images/btn_vai.gif); width: 34px; height: 24px; border: 0; margin: 0 0 2px 0; float: right; }
#menu { width: 366px; height: 40px; float: left; margin: 1px 0 0 0; }
.bg-sidebar { background: white; width: 366px; padding: 50px 0 0 0; }
#menu h2 { color: #ab0000; font-size: 18px; line-height: 18px; padding: 0 0 10px 15px; }
#menu ul { border-top: solid 1px #d5d5d5; padding: 0 0 38px 0; }
#menu li { border-bottom: solid 1px #f3f2f2; line-height: 30px; font-size: 13px; font-weight: bold; padding: 0 0 0 24px; }
#menu li a { color: black; }
Can somebody help me out on this one?
