Q: Horizontally Display Elements I am using the Get Me Cooking Plus recipe plugin for Wordpress. I would like to display the post image and post titles in the recipe index horizontally (like this site: http://foodfitnessfreshair.com/recipes/) instead of having them stacked vertically. I've tried display:inline, display:inline-block, and pretty much everything I could find that is relevant to displaying lists & tables horizontally. 
Here is the link to my site.
Here is the plugin CSS:
/* The container for the plugin */
.gmc-recipe {
    overflow: hidden;
    *zoom: 1;
    padding: 10px;
    position: relative;
}
.entry-content .gmc-recipe table {
    width: auto;
    font-size: inherit;
    color: inherit;
}
.entry-content .gmc-recipe table td {
    border: 0;
}
h2.gmc-recipe-title {
    float: left;
    width: inherit;
    vertical-align: top;
    margin-top: 0 !important;
    padding-top: 0 !important;
    max-width: 80%;
}
a.gmc-print-options {
    float: right;
    font-size: 0.8em;
    text-align: right;
    /*width: 85px / / If the printer icon is not on the same line as the / / words "print recipe" then uncomment this */
}
.gmc-clear-both {
    clear: both;
}
.gmc-recipe-main-photo {
    display: inline;
    float: left;
    margin-bottom: 10px;
}
.gmc-recipe-main-photo img {
    height: auto;
    width: auto;
}
/*The information next to the main photo */
 .entry-content table.gmc-recipe-summary, .entry-content table.gmc-recipe-summary-narrow {
    border: 0;
    border-spacing: 0;
    float: right;
    padding: 0 0 10px 0;
    margin: 0;
}
.entry-content table.gmc-recipe-summary {
    width: 250px;
    font-size: 0.8em;
}
.entry-content table.gmc-recipe-summary-narrow {
    clear: left;
    float: left;
    width: auto;
}
.entry-content .gmc-recipe-summary td, .entry-content .gmc-recipe-summary-narrow td {
    border: 0;
    padding-top: 0;
    padding-bottom: 2px;
}
td.gmc-heading, td.gmc-heading-narrow {
    font-weight: bold;
    padding-right: 10px;
    text-align: right;
    vertical-align: text-top;
    /* If "total time" shows on 2 lines, increase the width */
}
td.gmc-heading {
    width: 70px;
}
.no-main-photo td:first-child {
    width: inherit;
}
.gmc-recipe-description {
    display: none;
    visibility: hidden;
}
.gmc-recipe-ingredients {
    clear: both;
}
ul.gmc-ingredient-list {
    clear: left;
}
table.gmc-step-list {
    margin: 0;
    padding: 0;
}
.gmc-recipe-steps h2 {
    clear: both;
}
.entry-content table.gmc-step-list, .gmc-step-list-item td, td.gmc-step-list-title, td.gmc-group-list-title, td.gmc-step-list-title-wide {
    border: none;
}
td.gmc-group-list-title {
    font-weight: bold;
    padding: 0;
}
.gmc-group-list-title-wide {
    font-weight: bold;
    width: 12%;
}
.entry-content td.gmc-step-list-title {
    font-weight: bold;
    padding: 0;
}
.gmc-step-list-title-wide {
    font-weight: bold;
    width: 12%;
}
.gmc-step-list-item td {
    padding-bottom: 10px;
    padding-top: 0;
    vertical-align: top;
    text-align: inherit;
}
img.gmc-step-photo {
    width: 150px;
    height: auto;
    max-width: inherit !important;
    padding-top: 5px;
}
.gmc-img-right {
    float: right;
}
.gmc-powered-by {
    font-size: 0.7em;
    text-align: right;
}
table.no-main-photo {
    float: left;
    width: inherit;
    font-size: inherit;
}
.gmc-web-hidden {
    display: none;
}
ul.gmc-print-options-box, ul.gmc-print-options-box li {
    padding: 0;
    margin: 0;
    list-style: none;
}
.gmc-print-area {
    position: absolute;
    right: 5px;
    top: 10px;
}
.gmc-print-area img {
    padding: 0 5px 0 0;
    margin: 0;
    border: none;
    vertical-align: text-bottom;
}
ul.gmc-print-options-box {
    clear: both;
    margin: 0;
    padding: 5px 5px 0;
    float: right;
    border: solid 1px black;
    clear: both;
    position: relative;
    background-color: white;
}
.gmc-print-options-box li a {
    color: #555555;
    font-weight: bold;
    display: block;
    padding: 4px;
    text-decoration: none;
}
.gmc-print-options-box li a:hover {
    color: #999999;
}
ul.gmc_no_list_item {
    list-style: none;
    margin-left: 0;
}
.gmc_list_title {
    vertical-align: middle;
}
** > table.gmc_recipe_list, table.gmc_recipe_list td {
    border: none;
}
table.gmc_recipe_list td {
    vertical-align: middle;
}
table.gmc_recipe_list img {
    text-align: right;
    padding-left: 10px;
    padding-right: 10px;
}
** .gmc-nutrition-summary, .gmc-nutrition-advanced {
    clear: both;
}
.gmc-nutrition-summary td, .gmc-nutrition-summary th {
    border: 0;
}
.gmc-nutrition-summary th, .gmc-nutrition-summary td, .gmc-nutrition-advanced th, td.gmc_per_serving, td.gmc_100g, td.gmc_gda {
    text-align: center;
}
.gmc-nutrition-summary th {
    font-weight: bold;
}
td.gmc-nutrition-serving {
    text-align: left;
}
span.gmc-nutrition-serving {
    font-weight: bold;
}
@media print {
    font-family:"Times New Roman", "MS Georgia", serif;
    font-size: 12pt;
    tr, img {
        page-break-inside: avoid;
    }
    .gmc-print-hidden, ul.gmc-print-options-box {
        display: none !important;
    }
    .gmc-web-hidden {
        display: block !important;
    }
}

Thanks in advance!

A: The ideal solution would be to change your HTML. The images and text on your page are currently being displayed in tables. Tables are not ideal for positioning content and it isn't recommended that you try to float their rows and cells. The website that you're referencing is containing their images and captions within floated divs, which are better for positioning. You can do this too if you change the HTML in your plugin to include something like the following:
.my_floated_div {
    float: left;
    width: 20%;
}
.gmc_list_title {
    float: left;
    text-align: center;
}

<div class="gmc_recipe_list">
    <div class="my_floated_div">
        <a href="http://pathtomypost"><img src="http://pathtomyimage"></a>
        <span class="gmc_list_title">My image caption</a>
    </div>
</div>

However, if you find you absolutely cannot edit the HTML, adding this to your CSS may help to give you a similar result:
td.image {
    display: block;
}
.gmc_recipe_list tr, td.gmc_list_title {
    float:left;
}

