image resizing in slideshows

• 

  robtesting · Member · Sep 16, 2011 at 2:45 pm

  • Copy link
  • Add topic to favorites

  am trying to get the blog to have a front slideshow. I have assigned a page with an embedded slideshow. i want the slideshow to be the whole container inner width but when I place in the images they are being automatically resized.

  have been looking at it with firebug and the code all looks ok but it is still resizing.

  element.style {
  display: block;
  height: 410px;
  left: 0;
  line-height: 410px;
  opacity: 1;
  position: absolute;
  top: 0;
  width: 710px;
  z-index: 4;

  this is overriding everything else in the custom CSS. I put in images 710px x 410 px and they are resized to 550px x 280px

  does it have some type of auto resize? is there some way to work around.

  have only been able to get rid of the margin on one vertically oriented image despite the fact there is no margin in the code.
  Blog url: http://robtesting.wordpress.com/

• 

  designsimply · Member · Sep 16, 2011 at 3:41 pm

  • Copy link

  Well, you can resize the images in that slideshow with CSS, but the problem is that the image size itself is hard coded into the slide and that means that no matter what size the you update the images to in the CSS you cannot change the image size set by the slideshow itself (there is currently no option to update that) and so you will see upsized images with quality loss.

  Try this as an example to see what I mean:

  .slideshow-slide img {
       width: 100%;
       height: 100%;
  }

• 

  robtesting · Member · Sep 16, 2011 at 4:04 pm

  • Copy link

  that did the trick.

  thanks you so much

• 

  designsimply · Member · Sep 16, 2011 at 4:40 pm

  • Copy link

  Cheers :)