Hello everybody. Now I´m working on my first 3 column layout. I have a left and a right sidebar. The right one is on the bottom of the content.
Here is a link to the screenshot, because its still on my PC
http://i22.photobucket.com/albums/b346/Phelpsaholics/rightsidebar.jpg
Here is the code for the index.php
<?php get_header(); ?>
<!--content-->
<div id="page">
<!--left-col-->
<div id="contentwrapper">
<div id="content">
<!--post-->
<?php query_posts($query_string.'&cat=-3&&order=DESC');
while (have_posts()) : the_post(); ?>
<div class="entry" id="post-<?php the_ID(); ?>">
<p class="datum"><span class="content">Posted by: <?php the_author() ?><br />Tag: <?php the_category(', '); ?>
<br />Date: <?php the_time('jS, M, Y') ?></span></p>
<h1><a href="<?php the_permalink() ?>" rel="bookmark" title="Permanent Link to <?php the_title_attribute(); ?>"><?php the_title(); ?></a></h1>
<div style="clear:both;"></div>
<div class="entry-content">
<?php the_content(''); ?>
</div>
<div class="commentpost"><a href="http://s803.photobucket.com/albums/yy314/chrissy2504/Startingdays/?action=view¤t=comments.png" target="_blank"><img src="http://i803.photobucket.com/albums/yy314/chrissy2504/Startingdays/comments.png" border="0" alt="Photobucket"></a> <?php comments_popup_link('0 Comments', '1 Comments', '% Comments'); ?></div>
</div>
<!--post-end-->
<?php endwhile; ?>
<div class="navigation">
<?php if(function_exists('wp_paginate')) {
wp_paginate();
} ?>
</div><!--left-col-end-->
<?php get_sidebar('left'); ?>
<?php get_sidebar('right'); ?>
</div><!--content-end--><?php get_footer(); ?>
</div><!--wrapper-end-->
and here for the css style
/*Sidebar style*/
.left {
margin-left: 35px;
}
.left .title {
color: #FF9539;
font-family: century gothic ;
font-size: 11pt;
text-transform: uppercase;
text-align: center;
text-shadow: #000 1px 1px;
}
.left .inhalt {
color: #ffffff;
background-color:#4B4B4B;
font-family: verdana;
font-size: 7pt;
text-align: left;
-moz-border-radius: 10px;
-khtml-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
-moz-box-shadow: 3px 3px 3px #000;
-webkit-box-shadow: 3px 3px 3px #000;
box-shadow: 3px 3px 3px #000;
width: 300px;
}
.left .inhalt ul{
margin: 0;
list-style-type: none;
}
.left .inhalt p {
margin-left: 2px;}
.left h2 {
font-family: Trebuchet MS;
margin: 5px 0px 0px 0px;
color: #949050;
text-align: left;
text-transform: uppercase;
font-size: 8pt;
letter-spacing: 2px;
word-spacing: 1px;
}
.left .clear {
clear: both;
padding: 10px 0 0 0;
}
.left a{
color: #BF5677;
text-transform: uppercase;
font-family: verdana;
font-size: 7pt;
}
.right {
margin-left: 910px;
}
.right .title {
color: #FF9539;
font-family: century gothic ;
font-size: 11pt;
text-transform: uppercase;
text-align: center;
text-shadow: #000 1px 1px;
}
.right .inhalt {
color: #ffffff;
background-color:#4B4B4B;
font-family: verdana;
font-size: 7pt;
text-align: left;
-moz-border-radius: 10px;
-khtml-border-radius: 10px;
-webkit-border-radius: 10px;
border-radius: 10px;
-moz-box-shadow: 3px 3px 3px #000;
-webkit-box-shadow: 3px 3px 3px #000;
box-shadow: 3px 3px 3px #000;
width: 300px;
padding: 0px 0px 5px 10px;}
.right .inhalt ul{
margin: 0;
list-style-type: none;
}
.right .inhalt p {
margin-left: 2px;}
.right h2 {
font-family: Trebuchet MS;
margin: 5px 0px 0px 0px;
color: #949050;
text-align: left;
text-transform: uppercase;
font-size: 8pt;
letter-spacing: 2px;
word-spacing: 1px;
}
.right .clear {
clear: both;
padding: 10px 0 0 0;
}
.right a{
color: #BF5677;
text-transform: uppercase;
font-family: verdana;
font-size: 7pt;
}
I´ve trying to solve the problem since yesterday and I couldn´t find something. Thank you in advance