David BorrinkI need a fresh pair of eyes to see if I'm overlooking something obvious.
Something is interfering with some graphic divs I'm using to create rounded corners. The top div graphics are showing up on top of the content area background, but the bottom div graphics aren't.
I've gone over my css and my template pages to see why it's not working and I must be blind to something. I've double-checked my spellings, etc.
Here's a link to the site in development.
On the "home" page I have some custom content blocks and you can see the top and bottom pairs of round corners working well. But go to any other page and you'll see the bottom pair of rounded corners not working. Very baffling.
Here's the basic template structure of the content block for the regular pages (with notes) :
` <div id="contentwrapper">
<!-- this is the top pair of rounded corners -->
<div id="feature-top">
</div>
<!-- this is the content area -->
<div id="content" class="narrowcolumn">
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<div class="post" id="post-<?php the_ID(); ?>">
<h2><?php the_title(); ?></h2>
<div class="entry">
<?php the_content('<p class="serif">Read the rest of this page »</p>'); ?>
<?php wp_link_pages(array('before' => '<p>Pages: ', 'after' => '</p>', 'next_or_number' => 'number')); ?>
</div>
</div>
<?php endwhile; endif; ?>
<?php edit_post_link('Edit this entry.', '<p>', '</p>'); ?>
</div>
<!-- this is the bottom pair of rounded corners -->
<div id="feature-bottom">
</div>
</div>`
And here's the CSS for these items:
#contentwrapper {
float: right;
margin: 0px 24px 1px 0px;
width: 620px;
background: none;
}
#feature-top {
background: url('images/feature-top.gif') no-repeat top center;
height: 13px;
}
.narrowcolumn {
background: #eadf9b;
float: right;
padding: 0 24px 20px 24px;
width: 572px;
}
#feature-bottom {
background: url('images/feature-bottom.gif') no-repeat top center;
height: 13px;
}
