Title: Make thumbnails float
Last modified: August 19, 2016

---

# Make thumbnails float

 *  Resolved [Bluealek](https://wordpress.org/support/users/bluealek/)
 * (@bluealek)
 * [15 years, 4 months ago](https://wordpress.org/support/topic/make-thumbnails-float/)
 * I suppose my question is a no-brainer for template design experts, but I’m not
   one 😉
 * I’m using a plugin called List Category Posts to list categories in a template
   defined layout inside pages. It is possible to design your own template, so I’m
   struggling to modify the default template to list the posts the way I want them
   to. Basically, all I want to change is to make the thumbnails float left of the
   excerpt/content text to make space usage more rational. Here is the present code:
 *     ```
       //Show category?
       if ($cat_link_string != ''){
       	$lcp_output = '<p><strong>' . $cat_link_string . '</strong></p>';
       }else{
       	$lcp_output = '';
       }
       $lcp_output .= '<ul class="lcp_catlist">';//For default ul
       //Posts loop:
       foreach($catposts as $single):
       	$lcp_output .= '<li><a href="' . get_permalink($single->ID) . '">' . $single->post_title . '</a>';
       	//Show comments?
       	if($atts['comments'] == yes){
       		$lcp_output .= ' (' . $single->comment_count . ')';
       	}
       	//Style for date:
       	if($atts['date']=='yes'){
       		$lcp_output .= ' - ' . get_the_time($atts['dateformat'], $single);
       	}
       	//Show author?
       	if($atts['author']=='yes'){
       		$lcp_userdata = get_userdata($single->post_author);
       		$lcp_output .=" - ".$lcp_userdata->display_name;
       	}
       	//Show thumbnail?
       	if($atts['thumbnail']=='yes'){
       		$lcp_output .= '<div class="lcp_thumbnail"><a href="' . get_permalink($single->ID) . '">' . lcp_thumbnail($single) . '</div></a>';
       	}
       	//Show content?
       	if($atts['content']=='yes' && $single->post_content){
       		$lcpcontent = apply_filters('the_content', $single->post_content); // added to parse shortcodes
       		$lcpcontent = str_replace(']]>', ']]&gt', $lcpcontent); // added to parse shortcodes
       		$lcp_output .= '<p>' . $lcpcontent . '</p>'; // line tweaked to output filtered content
       	}
       	//Show excerpt?
       	if($atts['excerpt']=='yes' && !($atts['content']=='yes' && $single->post_content) ){
       		$lcp_output .= lcp_excerpt($single);
       	}
       	$lcp_output .='</li><hr>';
       endforeach;
       $lcp_output .= '</ul>';
       ```
   
 * I have successfully added the link to thumbnails, but I can’t resolve the harder
   part with the thumbnail float. I suppose I have to add the float:left somewhere
   but everything I’ve tried produces errors or simply displays a float:left text
   string. So, my question is – where and how exactly should I add this in order
   to get the thumbnail to float left of the textual content?

Viewing 1 replies (of 1 total)

 *  Thread Starter [Bluealek](https://wordpress.org/support/users/bluealek/)
 * (@bluealek)
 * [15 years, 4 months ago](https://wordpress.org/support/topic/make-thumbnails-float/#post-1831071)
 * Resolved by adding
 *     ```
       .lcp_thumbnail {
            float: left;
            margin-right: 1em;
       }
       ```
   
 * into the main stylesheet (style.css).

Viewing 1 replies (of 1 total)

The topic ‘Make thumbnails float’ is closed to new replies.

## Tags

 * [float](https://wordpress.org/support/topic-tag/float/)
 * [thumbnail](https://wordpress.org/support/topic-tag/thumbnail/)

 * 1 reply
 * 1 participant
 * Last reply from: [Bluealek](https://wordpress.org/support/users/bluealek/)
 * Last activity: [15 years, 4 months ago](https://wordpress.org/support/topic/make-thumbnails-float/#post-1831071)
 * Status: resolved

## Topics

### Topics with no replies

### Non-support topics

### Resolved topics

### Unresolved topics

### All topics