Item Description not responsive

Hello, I have one issue in item page, when there many pictures in a listing, the description of the listing appears only after the the list of pictures not in the right place. How i can make the text appears after the displayed image, not the list of images?

To clarify this here is a screenshot of the problem

and this is an example in my web page: algeriahome

You could put the <div id="description>...</id> inside the large image container.

Post your item.php file if you want me to edit it for you.

Hello, this is my item.php code

</ul>
    </li>
    <?php }; ?>
  </ul>
  <?php if( osc_images_enabled_at_items() ) { ?>
  <div class="item-photos">
    <div class="row">
      <?php
    if( osc_count_item_resources() > 0 ) {
        $i = 0;
    ?>
      <div class="col-lg-10"> <a href="<?php echo osc_resource_url(); ?>" class="main-photo" title="<?php echo osc_esc_html(__('Image', OSCLASSWIZARDS_THEME_FOLDER)); ?> <?php echo $i+1;?> / <?php echo osc_count_item_resources();?>"> <img class="img-responsive" src="<?php echo osc_resource_url(); ?>" alt="<?php echo osc_item_title(); ?>" title="<?php echo osc_item_title(); ?>" /> </a></div>
      <div class="col-lg-2">
        <div class="thumbs">
          <?php for ( $i = 0; osc_has_item_resources(); $i++ ) { ?>
            <div class="thumbs-image">
                <a href="<?php echo osc_resource_url(); ?>" class="fancybox" data-fancybox-group="group" title="<?php echo osc_esc_html(__('Image', OSCLASSWIZARDS_THEME_FOLDER)); ?> <?php echo $i+1;?> / <?php echo osc_count_item_resources();?>"> <img src="<?php echo osc_resource_thumbnail_url(); ?>" width="75" alt="<?php echo osc_item_title(); ?>" title="<?php echo osc_item_title(); ?>" class="img-responsive"/> </a>
              </div>
          <?php } ?>
        </div>
      </div>
      <?php } else{?>
      <div class="col-lg-10"> <a href="<?php echo osc_current_web_theme_url('images/no_photo.gif'); ?>" class="main-photo" title="<?php echo osc_esc_html(__('Image', OSCLASSWIZARDS_THEME_FOLDER)); ?> 1 / 1"> <img class="img-responsive" src="<?php echo osc_current_web_theme_url('images/no_photo.gif'); ?>" alt="<?php echo osc_item_title(); ?>" title="<?php echo osc_item_title(); ?>" /> </a></div>
      <div class="col-lg-2">
        <div class="thumbs"> <a href="<?php echo osc_current_web_theme_url('images/no_photo.gif'); ?>" class="fancybox" data-fancybox-group="group" title="<?php echo osc_esc_html(__('Image', OSCLASSWIZARDS_THEME_FOLDER)); ?> 1 / 1"> <img src="<?php echo osc_current_web_theme_url('images/no_photo.gif'); ?>" width="75" alt="<?php echo osc_item_title(); ?>" title="<?php echo osc_item_title(); ?>" class="img-responsive"/> </a> </div>
      </div>
      <?php } ?>
    </div>
  </div>
  <?php } ?>
  <div id="description">
    <p><?php echo osc_item_description(); ?></p>
    <div id="custom_fields">
      <?php if( osc_count_item_meta() >= 1 ) { ?>
      <br />
      <div class="meta_list">
        <?php while ( osc_has_item_meta() ) { ?>
        <?php if(osc_item_meta_value()!='') { ?>
        <div class="meta"> <strong><?php echo osc_item_meta_name(); ?>:</strong> <?php echo osc_item_meta_value(); ?> </div>
        <?php } ?>
        <?php } ?>
      </div>
      <?php } ?>
    </div>
    <?php osc_run_hook('item_detail', osc_item() ); ?>

You could work on css improving to get that problem fixed i think.
Send me a link to your website so i can take a look at it.

Hello arcsales this is my website https://algeriahome.com

Oh you had the link above. Excuse me.
Anyway i was looking to find a way by using only css and i could not do it. May my css skills got a little rusty. Anyway i’ve got an idea… why not put the thumbs in vertical slider? Here is the source code of one that i think will do the job: https://lowercolumbia.edu/_resources/plugins/royal-slider/templates/simple-vertical/

If you are having troubles integrating it, i can do it for you.