スライドショーの画像を中央揃えにしたい

Question

スライドショー（class="slideshow"）内の、縦・横画像を、十字になるようにセンタリングしたいのですが。
text-alignなど試してみてもうまく中央揃えができません。
画像一枚ずつをmarginでポジショニングすればよいのでしょうか？

わかる方いましたらご指導のほどよろしくお願いします。

<!-- Next and previous buttons -->
<div id="slideshow" class="slideshow">
     <div class="Slidesshow_screen"><a href="#1"><img class="Slideshow_img" src="" width="390px" height="520px" alt="Airu_01" /></a></div>
     <div class="Slidesshow_screen"><a href="#2"><img class="Slideshow_img" src="" width="390px" height="520px" alt="Airu_02" /></a></div>
     <div class="Slidesshow_screen"><a href="#3"><img class="Slideshow_img" src="" width="390px" height="520px" alt="Airu_03" /></a></div> 
     <div class="Slidesshow_screen"><a href="#4"><img class="Slideshow_img" src="" width="546px" height="364px" alt="Airu_04" /></a></div>
     <div class="Slidesshow_screen"><a href="#5"><img class="Slideshow_img" src="" width="546px" height="364px" alt="Airu_05" /></a></div>
</div>

<div class="PHotolist">
    <ul>
     <li><a href="javascript:void(0);"><img src=""width="120" height="95" alt="" /></a></li>
     <li><a href="javascript:void(0);"><img src="" width="120" height="95" alt="" /></a></li>
     <li><a href="javascript:void(0);"><img src="" width="120" height="95" alt="" /></a></li>
     <li><a href="javascript:void(0);"><img src="" width="120" height="95" alt="" /></a></li>
     <li><a href="javascript:void(0);"><img src="" width="120" height="95" alt="" /></a></li>
   </ul>
</div>

CSS

.slideshow {
	higtht:550px;
	weight:550px;
	position:relative;
	left:200px;
	margin: 50px;"
}

.caption-container {
	position:relative; 
	top:300px; 
	left:850px;
}
.PHotolist {
	position:absolute; 
	top:30px; 
	right:500px;
}

nav ul{
display: table;
margin: 0 auto;
padding: 0;
width: 80%;
text-align: center;
}
nav ul li{
display: table-cell;
min-width: 50px;
border-right: 1px solid #ccc;
}
nav ul li:first-child{
border-left: 1px solid #ccc;
}
nav ul li a{
display: block;
width: 100%;
padding: 10px 0;
text-decoration: none;
color: #aaa;
}
nav ul li a:hover{
background-color:#F8E750;
border-bottom: 5px solid #F8E750;
}
nav ul li.current{
font-weight: bold;
}
nav ul li.current a{
border-bottom: 3px solid #ff3355;
color: #00B0F0;
}

Store_Name{
	text-align: center;
	color:#fe0000;
}

	
#slideshow div div {
    top: 0;
    left: 0;
    position: absolute;
}
 
#slideshow ul {
    width: 400px;
}
 
#slideshow ul li {
    align-content: flex-end;
    margin: 5px;
    float: left;
    display:inline;
}
 
#slideshow .active {
    filter:alpha(opacity=100)!important;
    -moz-opacity: 1!important;
    opacity: 1!important;
}
 

#slideshow ul:after {
    content: ".";
    height: 0;
    clear: both;
    display: block;
    visibility: hidden;
}
 
#slideshow ul {
    display: inline-block;
    overflow: hidden;
}

.Slideshow_img {
	position: relative;
    margin: 0px auto;
}

.Slidesshow_screen {
	position: relative;
	text-align: center;
}

JQuery

$(function(){
    var setId = '#slideshow';
    var fadeTime = 1000;
    var delayTime = 5000;
 
    $(setId + ' div div').each(function(i){
        $(this).attr('id','view' + (i + 1).toString());
        $(setId + ' div div').css({zIndex:'98',opacity:'0'});
        $(setId + ' div div:first').css({zIndex:'99'}).stop().animate({opacity:'1'},fadeTime);
    });
 
    $(setId + ' ul li').click(function(){
        clearInterval(setTimer);
 
        var connectCont = $(setId + ' ul li').index(this);
        var showCont = connectCont+1;
 
        $(setId + ' div div#view' + (showCont)).siblings().stop().animate({opacity:'0'},fadeTime,function(){$(this).css({zIndex:'98'})});
        $(setId + ' div div#view' + (showCont)).stop().animate({opacity:'1'},fadeTime,function(){$(this).css({zIndex:'99'})});
 
        $(this).addClass('active');
        $(this).siblings().removeClass('active');
 
        timer();
 
    });
 
    $(setId + ' ul li:not(.active)').hover(function(){
        $(this).stop().animate({opacity:'1'},200);
    },function(){
        $(this).stop().animate({opacity:'0.5'},200);
    });
 
    $(setId + ' ul li').css({opacity:'0.5'});
    $(setId + ' ul li:first').addClass('active');
 
    timer();
 
    function timer() {
        setTimer = setInterval(function(){
            $('li.active').each(function(){
                var listLengh = $(setId + ' ul li').length;
                var listIndex = $(setId + ' ul li').index(this);
                var listCount = listIndex+1;
 
                if(listLengh == listCount){
                    $(setId + ' ul li:first').click()
                } else {
                    $(this).next('li').click();
                };
            });
        },delayTime);
    };
});

Answer 1

typoでは？

.slideshow {
    higtht:550px;
    weight:550px;