Trying to Align Images Properly

You are trying to align them side-by-side, in a div that is not wide enough (grid_10). Your grid_10 class is only 780px wide. If you change that div to grid_12, you will have the full 940px to work with, with plenty of room for the three images side-by-side, with gutter space in-between.

Since you are working with a three column grid layout, why don’t you do three equal-sized divs across? To do this, you will want to copy the current page template being used to display this page. Create a new page template named services.php, and paste the code you copied from the current theme. At the very top of the page, you will want to insert this code:

/*
Template Name: Services
*/

Go down to the main content area and replace the <div class=”grid_10″>…</div> and <div class=”grid_2″>…</div> area with the code below.

<div class="grid_4"><!--Your First Image Code--></div>
<div class="grid_4"><!--Your Second Image Code--></div>
<div class="grid_4"><!--Your Third Image Code--></div>

Once you have the new page template saved, you will need to go into the WP admin panel, navigate to the “services” page and select the new services template you just created.

I don’t know your level of experience with WP theming, so if this is confusing you should read this.

Reserved while i read your recent post.

-Edited

Hey so i’m accessing my default page template to copy it and make changes but i dont see “grid_10” lines of code. This is what i have:

<?php
get_header();
$col = get_column_data($custom_settings[“layout”][“columns”]); // get column data for layout – can be overriden
?>
<div class=”clearfix”>
<?php echo “<div class=’grid_”.$col[1].”‘>”; ?>
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<div class=”post clearfix” id=”post-<?php the_ID(); ?>”>
<?php get_thumbnail_above_post($post->ID, $col[1]); ?>
<h2 class=”posttitle”><?php the_title(); ?></h2>
<?php if(has_excerpt()) { the_excerpt(); }else{ the_content(custom_readmore()); } ?>
<?php wp_link_pages(array(‘before’ => ‘<p>Pages: ‘, ‘after’ => ‘</p>’, ‘next_or_number’ => ‘number’)); ?>
</div>
<?php endwhile; endif; ?>
<?php edit_post_link(‘Edit this entry.’, ‘<p>’, ‘</p>’); ?>
</div><!– //col 1–>

<?php if($col[2]){ ?><div class=”grid_<?php echo $col[2]; ?>”><?php } ?>
<?php if($col[2]){ ?>
<?php if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘column_2’) ) : endif; ?>
<?php if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘column_2_page’) ) : endif; ?>
<?php } ?>
<?php if($col[2]){ ?></div><?php } ?>

<?php if($col[3]){ ?><div class=”grid_<?php echo $col[3]; ?>”><?php } ?>
<?php if($col[3]){ ?>
<?php if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘column_3’) ) : endif; ?>
<?php if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘column_3_page’) ) : endif; ?>
<?php } ?>
<?php if($col[3]){ ?></div><?php } ?>
</div><!– //clearfix –>

<?php if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘footer’) ) : endif; ?>
<?php if ( !function_exists(‘dynamic_sidebar’) || !dynamic_sidebar(‘footer_page’) ) : endif; ?>
<?php get_footer(); ?>

Your template is using php to display the html dependent on settings entered through your theme options menu. Try saving this code in a file named services.php, in your theme’s directory. Don’t forget to select the “Services” page template in the WP admin afterward.

<?php /* Template Name: Services
*/ ?> 

<?php
get_header();
?>
<div class="clearfix">

<div class="grid_12">
<?php if (have_posts()) : while (have_posts()) : the_post(); ?>
<div class="post clearfix" id="post-<?php the_ID(); ?>">
<h2 class="posttitle"><?php the_title(); ?></h2>
<?php if(has_excerpt()) { the_excerpt(); }else{ the_content(custom_readmore()); } ?>
</div>
<?php endwhile; endif; ?>
<?php edit_post_link('Edit this entry.', '<p>', '</p>'); ?>

</div><!-- //full-width column -->
<div class="clearfix"></div>

<?php get_footer(); ?>

wow! Thank you so much man ! it worked out great and you even taught me a few things

That’s the best I could ask for. It’s my pleasure, to save you from blowing your brains out.