Hi,
Well, im trying to code a theme.. But I have one problem: I want to have the content and sidebar div to be equal in height. I googled a bit and tried some method's I found, but couldn't get any to work.
Could anyone explain me how to do this?
Thanks
My index.php:
<?php get_header(); ?>
<div id="container">
<?php if(have_posts()) : ?><?php while(have_posts()) : the_post(); ?>
<div class="post" id="post-<?php the_ID(); ?>">
<h2><a href="<?php the_permalink(); ?>" title="<?php the_title(); ?>"><?php the_title(); ?></a></h2>
<div class="entry">
<?php the_content(); ?>
<p class="postmetadata">
<?php _e('Filed under:'); ?> <?php the_category(', ') ?> <?php _e('by'); ?> <?php the_author(); ?><br />
<?php comments_popup_link('No Comments »', '1 Comment »', '% Comments »'); ?> <?php edit_post_link('Edit', ' | ', ''); ?>
</p>
</div>
</div>
<?php endwhile; ?>
<div class="navigation">
<?php posts_nav_link(); ?>
</div>
<?php else : ?>
<div class="post">
<h2><?php _e('Not Found'); ?></h2>
</div>
<?php endif; ?>
</div>
</td>
<?php get_sidebar(); ?>
<?php get_footer(); ?>
my styles.css
body, h1, h2, h3, h4, h5, h6, blockquote, p, form{
margin: 0;
padding: 0;
}
body{
margin: 0;
font-family: Helvetica, Arial, Sans-serif;
font-size: 12px;
text-align: center;
vertical-align: top;
background: #ffffff;
background-image: url(images/bg.jpg);
color: #e5e5e5;
}
h1{
font-family: Helvetica, Arial, Sans-serif;
font-size: 24px;
padding: 0 0 10px 0;
}
a:link, a:visited{
text-decoration: none;
color: #33ccff;
}
a:hover{
text-decoration: none;
color: #ffffff;
background-color: #33ccff;
}
p{
padding: 10px 0 0 0;
}
#wrapper{
margin: 0 auto 0 auto;
width: 1000px;
text-align: left;
}
#header{
float: left;
width: 1000px;
}
#container{
float: left;
width: 700px;
background-color: #111211;
}
.post{
padding: 10px 0 10px 0;
}
.post h2{
font-family: Helvetica, Arial, Sans-serif;
font-size: 18px;
}
.entry{
line-height: 18px;
}
p.postmetadata{
border-top: 1px solid #ccc;
margin: 10px 0 0 0;
}
.navigation{
padding: 10px 0 0 0;
font-size: 14px;
font-weight: bold;
line-height: 18px;
}
.sidebar{
float: left;
width: 300px;
background-color: #111211;
}
.sidebar ul{
list-style-type: none;
margin: 0;
padding: 0 10px; 0 10px;
}
.sidebar ul li{
padding: 10px 0 10px 0;
}
.sidebar ul li h2{
font-family: Helvetica, Arial, Sans-serif;
font-size: 16px;
color: #ffffff;
}
.sidebar ul ul li{
padding: 0;
line-height: 24px;
}
table#wp-calendar{
width: 100%;
}
.comments-template{
margin: 10px 0 0;
border-top: 1px solid #ccc;
padding: 10px 0 0;
}
.comments-template ol{
margin: 0;
padding: 0 0 15px;
list-style: none;
}
.comments-template ol li{
margin: 10px 0 0;
line-height: 18px;
padding: 0 0 10px;
border-bottom: 1px solid #ccc;
}
.comments-template h2, .comments-template h3{
font-family: Helvetica, Arial, Sans-serif;
font-size: 16px;
}
.commentmetadata{
font-size: 12px;
}
.comments-template p.nocomments{
padding: 0;
}
.comments-template textarea{
font-family: Helvetica, Arial, Georgia, Sans-serif;
font-size: 12px;
}
#footer{
padding: 10px 0 0 0;
clear: both;
float: left;
width: 1000px;
}
#footer p{
line-height: 18px;
text-align: center;
}