Need A Little help

tmc328

New Member
Listen, if I am asking too much I understand, but I really think this may be simple for most of you guys. My issue is this: I am using wordpress and the theme I utilize has a great deal of empty space. I would like to know what to do to use this area. http://texajob.com You'll see the center area has blank space and I'd like to be able to include various images. Below is the code for the index.php file and the style.css file. Thanks to anyone who takes the time:

<?php get_header() ?>

<?php get_sidebar() ?>

<div class="contentwrapper">
<div>
<div class="contentol">
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<div <?php if (function_exists('post_class')) { post_class(); } else { echo 'class="post"'; } ?> id="post-<?php the_ID(); ?>">
<h1 class="content_header">
<a href="<?php the_permalink() ?>" title="<?php the_title() ?>"><?php the_title() ?></a>
</h1>

<div class="content">
<?php the_time('d M y - '); woogle_content('',TRUE,'',25); ?>
<br />

<span class="content_footer">
<cite><?php the_permalink() ?> - </cite>
<?php the_category(' - ') ?>

<?php edit_post_link('Edit',' - ',''); ?>
</span>
</div>
</div>

<?php endwhile; ?>

<div style="clear:both"></div>

<?php else : ?>
<p>No standard web pages were found.</p>
<p>Suggestions:</p>
<ul>
<li>* Make sure all words are spelled correctly.</li>
<li>* Try different keywords.</li>
<li>* Try more general keywords.</li>
<li>* Try fewer keywords.</li>
</ul>
<?php endif; ?>
</div>
</div>
</div>

<br clear="all" />

<?php
global $wp_query;
$max_page = $wp_query->max_num_pages;
$paged = intval(get_query_var('paged'));
if(empty($paged) || $paged == 0) {
$paged = 1;
}
if ($max_page != 1) {
?>
<table id="pagenav">
<?php if(function_exists('wp_paginate')) {
wp_paginate();
} ?>


<?php } ?>

<?php get_footer() ?>


/*
Theme Name: Woogle
Theme URI: http://ericulous.com/2009/03/18/wp-theme-woogle-the-google-search-engine-clone
Description: Google Search Engine on Wordpress
Version: 1.2
Author: Genkisan
Author URI: http://ericulous.com/
Tags: white, fluid width, two columns, widgets
*/

html {
font-size: small;
font-family: arial, sans-serif;
}
body {
background: #fff;
margin: 3px 8px;
color: #000;
font-size: small;
font-family: arial, sans-serif;
}
h1 {
font-size: 1.5em;
}
h2 {
font-size: 1.4em;
}
h3 {
font-size: 1.3em;
}
h4 {
font-size: 1.2em;
}
a:link {
color: #0007ee;
}
a:visited {
color: #551a8b;
}
a:active {
color: red;
}
em {
font-weight: bold;
font-style: normal;
}
cite {
color: green;
font-style: normal;
}
form {
display: inline;
}
blockquote {
border-left: 2px solid #ccc;
color: #888;
margin: 2em;
padding: 0 0 0 1em;
}


/* header */
#header_top {
padding-left: 2px;
height: 22px;
font-size: 13px;
padding-top: 1px! important;
float: left;
}
#header_top ul {
list-style: none;
margin: 0;
padding: 0;
}
#header_top ul li {
display: inline;
margin: 0;
margin-right: 0.73em;
padding: 0;
}
#header_top ul li a:visited {
color: #0007ee;
}

#header_top ul li.current-menu-item a, #header_top ul li.current-menu-item a:visited {
color: #000;
font-weight: bold;
text-decoration: none;
}

#header_top ul li.current_page_item a, #header_top ul li.current_page_item a:visited {
color: #000;
font-weight: bold;
text-decoration: none;
}
#header_topright {
margin: 0;
padding: 1px 0 7px 0;
text-align: right;
}
.header_top_border {
border-top: #c9d7f1 1px solid;
font-size: 1px;
width: 100%;
position: absolute;
top: 24px;
height: 0;
}
.header_top_border_left {
left: 0;
}
.header_top_border_right {
right: 0;
}
#logo {
display: block;
margin: 14px 0 7px 0;
overflow: hidden;
width: 150px;
position: relative;
height:52px;
padding-right: 8px;
}
#logo img {
left: 0;
border-top-style: none;
border-right-style: none;
border-left-style: none;
position: absolute;

border-bottom-style: none;
}
#logo span {
cursor: pointer;
}
.topsearch {
border-collapse: collapse;
}
.topsearch td {
padding: 0;
}
.topsearch td.td_topsearch {
width: 100%;
padding: 1px 0 7px 0
}
#header_bottom {
border-top: #6b90da 1px solid;
background: #f0f7f9;
clear: both;
margin: 0 0 11px 0;
padding: 0.1em;
}
#header_bottom div {
font-weight: bold;
float: left;
padding: 4px 0.5em 0 4px;
}
#header_bottom p {
margin: 0.1em 0;
padding: 0.2em;
white-space: nowrap;
text-align: right;
}
/* end header */


/* content */
.contentwrapper {
font-weight: normal;
font-size: medium;
margin: 0;
padding: 0 1em 0 0;
}
.post {
font-size: small;
font-family: arial, sans-serif;
margin: 1em 0;
}
.content_header {
font-weight: normal;
margin: 0;
font-size: medium;
display: inline;
}
.content {
max-width: 42em !important;
width: 55%;
}
.content_footer a, .content_footer a:visited {
color: #77c;
}
/* end content */


/* comments*/
.commentlist {
margin: 0;
padding: 0;
}

.commentlist li {
margin: 15px 0 3px 0;
padding: 5px 10px 3px 10px;
list-style: none;
border: 1px solid #efefef;
background: #fafafa;
}

.commentlist li .avatar {
float: right;
border: 1px solid #eee;
padding: 2px;
margin: 0 0 10px 10px;
background: #fff;
}

.commentlist p {
margin: 10px 5px 10px 0;
}

.replycomment a{
color: #999;
}

#commentform p {
margin: 5px 0;
}

.nocomments {
text-align: center;
margin: 0;
padding: 0;
}

.commentmetadata {
}

.commentmetadata a {
color: #111;
}

.commentmetadata a:hover {
color: #555;
}

.commentsnavigation {
padding: 20px 0 30px 0;
}

.commentlist ul.children li {
background-color: #e3e3e3;
border: 1px solid #efefef;
}

.commentlist ul li.depth-2 {
background-color: #f1f1f1;
}

.commentlist ul li.depth-3 {
background-color: #ececec;
}

.commentlist ul li.depth-4 {
background-color: #e8e8e8;
}

.commentlist ul li.depth-5 {
background-color: #e3e3e3;
}
/* end comments */

/* sidebar */
#sidebar {
float: right;
padding: 0;
background: #fff;
border-left: #fff 10px solid;
white-space: nowrap;
border-spacing: 0;
margin-bottom: 1em;
width: 30%;
}
#sidebar td {
padding-left: 10px;
border-left: #c9d7f1 1px solid;
}
#sidebar h2 {
color: #676767;
font-size: small;
font-family: arial, sans-serif;
font-weight: normal;
padding: 0;
margin: 0;
text-align: center;
}
#sidebar p {
margin: -0.5em 0 0 0.5em;
text-align: center;
}
#sidebar ul {
list-style-type: none;
padding: 0;
margin: 0 0 3em 0;
}
#sidebar ul li {
padding: 0;
margin: 1em 0;
}
#sidebar ul li ul {
margin: 0;
}
#sidebar li ul li{
margin: 0 1em;
}
#sidebar cite {
display: block;
text-align: left;
}
/* end sidebar */


/* footer*/
#pagenav {
margin: auto auto 1.4em;
direction: ltr;
border-collapse: collapse;
text-align: center;
}
#pagenav td {
padding: 0;
text-align: center;
}
#pagenav a {
color: #000;
display: block;
}
#pagenav a:visited {
color: #000;
}
#pagenav .b a {
color: #0007ee;
font-weight: bold;
}
#pagenav .b a:visited {
color: #0007ee;
}
.pagenav_current {
font-weight: bold;
color: #a90a08;
}
.csb {
display: block;
background: url(images/pagenav.png) no-repeat;
height: 26px;
} /* within pagenav */
.bottombar {
clear: both;
margin-top: 1.4em;
text-align: center;
}
#bottomsearch {
border-bottom: #6b90da 1px solid;
border-top: #6b90da 1px solid;
background: #f0f7f9;
margin: 11px 0;
margin-top: 0;
padding: 1.8em 0;
}
#footerpages ul {
list-style: none;
margin: 0;
padding: 0;
}
#footerpages ul li {
display: inline;
margin: 0;
margin-right: 0.73em;
padding: 0;
}
/* end pagenav */


/* begin images */
p img {
padding: 0;
max-width: 100%;
}

/* Using 'class="alignright"' on an image will (who would've
thought?!) align the image to the right. And using 'class="centered',
will of course center the image. This is much better than using
align="center", being much more futureproof (and valid) */

img.centered {
display: block;
margin-left: auto;
margin-right: auto;
}

img.alignright {
padding: 4px;
margin: 0 0 2px 7px;
display: inline;
}

img.alignleft {
padding: 4px;
margin: 0 7px 2px 0;
display: inline;
}

.alignright {
float: right;
}

.alignleft {
float: left
}
/* end images */


/* captions */
.aligncenter,
div.aligncenter {
display: block;
margin-left: auto;
margin-right: auto;
}

.wp-caption {
border: 1px solid #ddd;
text-align: center;
background-color: #f3f3f3;
padding-top: 4px;
margin: 10px;
-moz-border-radius: 3px;
-khtml-border-radius: 3px;
-webkit-border-radius: 3px;
border-radius: 3px;
}

.wp-caption img {
margin: 0;
padding: 0;
border: 0 none;
}

.wp-caption p.wp-caption-text {
font-size: 11px;
line-height: 17px;
padding: 0 4px 5px;
margin: 0;
}
/* end captions */


/* misc */
.navigation {
margin-top: 40px;
padding: 20px 0 50px 0;
border-top: 1px solid #ccc;
}

.alignright {
float: right;
}

.alignleft {
float: left;
}
.clr {
clear: both;
}
/* end misc */
 

ronaldroe

Super Moderator
Staff member
The quick answer to your question is: put it after the main loop, and float the column to the left.

The better answer is: I would shift the main content to the right to give it some breathing room on the left side, and then expand it across to the sidebar.
 

tmc328

New Member
Thanks

I appreciate your response and such a quick one to boot. Unfortunately, I am really confused by what you said. I will however, make an effort..Thanks again
 
Top