Title: Loop/Column css issues
Last modified: August 20, 2016

---

# Loop/Column css issues

 *  [datakid](https://wordpress.org/support/users/datakid/)
 * (@datakid)
 * [13 years, 8 months ago](https://wordpress.org/support/topic/loopcolumn-css-issues/)
 * I am having some sort of nightmare. My code worked perfectly on localhost (ubuntu
   12.04.x) but is now failing on the host.
 * I have a simple loop on the front page, below a picture, in it’s own div.
 * I want it to show the featured image and excerpt from three specific pages. I
   want those three page excerpts/pics to come up in the following order from left
   to right (by page_id): 38, 23, 29
 * frontpage.php:
 * ….
 *     ```
       <div id="front-box">
       	<?php $args=array('order' =>'asc','post_type' =>'page','post__in' => array(38,23,29), ); $page_query = new WP_Query($args); ?>
   
       	<?php while ($page_query->have_posts()) : $page_query->the_post(); ?>
       		<?php if ( get_the_ID()==38 ) { ?> <div id="front-box-left">
       		<?php } elseif ( get_the_ID()==23 ) { ?><div id="front-box-center">
       		<?php }	else { ?> <div id="front-box-right">
       		<?php } the_post_thumbnail() ?>
       		<div id="front-box-info"><h2><a href="<?php the_permalink();?>" id="front-box-header"><?php the_title();?></a></h2>
       		<span id="front-box-text"><?php the_excerpt();?></span><!-- #front-box-text --></div><!-- #front-box-info -->
       					</div> <!-- #left-center-right css id -->
       	<?php endwhile; ?>
       </div> <!-- #front-box -->
       ```
   
 * ….
 * All good so far – I’m getting exactly what I want, but in the wrong order. In
   fact, I’m getting 23, 38, 29 – which is wrong 😐 The div’s are all correct, 38
   is getting id=”front-box-left”, 23 getting id=”front-box-center” and etc.
 * Here’s the css:
 *     ```
       /* For the front page boxes */
       #front-box-left, #front-box-center, #front-box-right {
       	height: 405px;
       	width: 235px;
       	margin-top: 14.5px;
       }
   
       #front-box-left, #front-box-center {
       	border-right: 1px solid #c7b6a5;
       	padding-right: 14.5px;
       	margin-right: 14.5px;
       }
       #front-box-left {
       	float: left;
       }
       #front-box-center {
       	float: left;
       }
       #front-box-right {
       	float: right;
       }
   
       #front-box-text {
       	font-family: sans-serif;
       	font-size: 15px;
       	line-height: 1.35em;
       }
   
       #front-box-info {
       	width: 235px;
       	height: 240px;
       	margin-top: 5px;
       }
       ```
   
 * What the hell is going wrong?

Viewing 1 replies (of 1 total)

 *  Thread Starter [datakid](https://wordpress.org/support/users/datakid/)
 * (@datakid)
 * [13 years, 8 months ago](https://wordpress.org/support/topic/loopcolumn-css-issues/#post-3128600)
 * Don’t fret – I solved the problem by creating the page 23 again (so it was page
   61 instead of 23)
 * Seems crazy to think that it’s so dependant on the page_id order…
 * cheers

Viewing 1 replies (of 1 total)

The topic ‘Loop/Column css issues’ is closed to new replies.

## Tags

 * [css](https://wordpress.org/support/topic-tag/css/)
 * [div](https://wordpress.org/support/topic-tag/div/)
 * [front page](https://wordpress.org/support/topic-tag/front-page/)
 * [loop](https://wordpress.org/support/topic-tag/loop/)
 * [three column](https://wordpress.org/support/topic-tag/three-column/)

 * In: [Fixing WordPress](https://wordpress.org/support/forum/how-to-and-troubleshooting/)
 * 1 reply
 * 1 participant
 * Last reply from: [datakid](https://wordpress.org/support/users/datakid/)
 * Last activity: [13 years, 8 months ago](https://wordpress.org/support/topic/loopcolumn-css-issues/#post-3128600)
 * Status: not resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics