Horizontal responsive layout

Use these settings [photospace horizontal_thumb=true sync_transitions=0]

Add this to style.css in your theme folder. You may need to adjust to suit the size of your gallery (see comments).



.photospace {
    position:relative;
    margin-bottom: 20px !important;
    min-height: 200px; /* space for loader */
}

.photospace,
.photospace .thumnail_col,
.photospace .gal_content,
.photospace .slideshow-container,
.photospace .slideshow span,
.photospace .slideshow a.advance-link,
.photospace .slideshow img{
    width: 100% !important;
    height: auto !important;
}

.photospace .slideshow span{
  display: block !important;
}

.photospace .gal_content{
  float: none !important;
}

.photospace .slideshow span{
  position: relative !important; /* Keep the gallery height - Doesn't work with synced transistions */
}

.photospace .loader{
  width: 100px !important;
  height: 100px !important;
  top: 50% !important;
  left: 50% !important;
  margin-left: -50px;
}

.photospace .thumbs_wrap2{
    min-height:45px; /* space for thumbnails */
    overflow: hidden;
}

.photospace .thumbs{
   min-height:40px;
}

.photospace .thumbs_wrap{
    float: left;
    left: 50%;
    position: relative;
}

.photospace .pageLink.next{
    margin-right:0;
}

.photospace .thumnail_col {
    float: left;
    left: -50%;
    width:auto  !important;
    position: relative;
}

.photospace ul.thumbs {
    float:left;
}

.photospace span.image-caption{
    position: inherit !important;
}