css - My design has two columns, the right is on the right but below the left column. Why? -
my design has 2 columns .leftcolumn & .rightcolumn. suppose next each other in design, both left , right should be, .rightcolumn below .leftcolumn on right. why?
css:
.coursecontent { width: 1200px; } .leftcolumn{ width: 860px; float: left; border-right-style: solid; border-right-width: 2px; border-right-color: #efefef; } .rightcolumn{ float: right; width: 300px; } the page:
<!doctype html> <html> <?php /** * template name: single event template */ get_header(); ?> <div class="coursecontent"> <div class="leftcolumn"> <?php while ( have_posts() ) : the_post(); ?> <h1> <?php the_title(); ?> </h1> </br> <?php echo '<div class="tagsremove">'; global $post; $nexttagthumb='-1'; $tags = wp_get_post_tags($post->id); foreach ($tags $tag) : if ($tags) { $what_tag = $tags[($nexttagthumb+'1')]->term_id; $args=array( 'tag__in' => array($what_tag), 'post__not_in' => array($post->id), 'showposts'=>100, 'caller_get_posts'=>1 ); ?> <div class="tags_course_single"> <h5> similar courses: </h5> <?php $my_query = new wp_query($args); if( $my_query->have_posts() ) { while ($my_query->have_posts()) : $my_query->the_post(); ?> <a href="<?php echo get_permalink(); ?>"> <?php the_title(); ?></a>, <?php endwhile; } wp_reset_query(); $nexttagthumb = ($nexttagthumb+1); } endforeach; ?> </div> <br /> <?php echo '</div>'; ?> <div class="imageandtext"> <div class="mainimage"> <?php if ( has_post_thumbnail() ) { the_post_thumbnail();} ?> </div> <?php the_content(); ?> </div> <?php endwhile; ?> </div> <div class="rightcolumn"> <div class="countersingle"> <h4> when course starts: </h4> <h6> (there maybe more 1 possible start date) </h6> <?php $count = 0; $your_repeater = get_field('add_date'); if($your_repeater){ while( have_rows('add_date') ): the_row(); $count++; $my_field = get_sub_field('course_date'); if ($count == 1) { $todays_date = date("y-m-d"); $today = strtotime($todays_date); $expiration_date = strtotime($my_field); if ($expiration_date > $today) { $date12 = new datetime($my_field); $date13 = new datetime($todays_date); $diff=date_diff($date12,$date13); echo '1. ' . $my_field ; echo '<div class="reddays"> in '. $diff->format("%r%a days.") .'<a href="'.get_page_link('10') .'"> contact now</a></div>'; } else { echo '' ; } } if ($count == 2) { $todays_date = date("y-m-d"); $today = strtotime($todays_date); $expiration_date = strtotime($my_field); if ($expiration_date > $today) { $date12 = new datetime($my_field); $date13 = new datetime($todays_date); $diff=date_diff($date12,$date13); echo '2. ' .$my_field ; echo '<div class="reddays"> in '. $diff->format("%r%a days.") .'<a href="'.get_page_link('10') .'"> contact now</a></div>'; } else { echo '' ; }} if ($count == 3) { $todays_date = date("y-m-d"); $today = strtotime($todays_date); $expiration_date = strtotime($my_field); if ($expiration_date > $today) { $date12 = new datetime($my_field); $date13 = new datetime($todays_date); $diff=date_diff($date12,$date13); echo '3. ' .$my_field ; echo '<div class="reddays"> in '. $diff->format("%r%a days.") .'<a href="'.get_page_link('10') .'"> contact now</a></div>'; } else { echo '' ; } } if ($count == 4) { } if ($count == 5) { } echo '</ul>'; endwhile; }?> </div> <div class="mathsandenglish"> <h4> improve maths , english @ same time </h4> <?php $key_1_value = get_post_meta( get_the_id(), 'twitter_embed', true ); if( ! empty( $key_1_value ) ) { echo $key_1_value; } ?> </div> </div> </div> <?php get_footer(); ?> </html>
in foreach ($tags $tag) : loop in leftcolumn open <div class="tags_course_single"> don't close it, looks trying close after loop, endforeach; ?> </div> move </div> after $nexttagthumb = ($nexttagthumb+1); inside loop.
also have </br> should <br /> near top :)
also don't have <head> tag in html , other stuff should inside <body> tag.