css 左右の背景が異なる設定方法
下記の１ページだけ、右背景が途中で切れてしまう不具合が出てしまいました。
このような感じです。
http://marimekko2525.web.fc2.com/
設定方法は下記のサイトを参考にして作りました。
http://www.webopixel.net/javascript/517.html
スライドショーが入っている”<div id="cont">”部分に原因があると思うのですが、
改善策が分かりません。。。
どなたか分かる方いらっしゃいましたらアドバイスをお願いします。
cssソース
/*====↓reset.css↓====*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form,fieldset,legend,input,p,blockquote,th,td { margin:0;padding:0; }
img{
border: 0;
}
/*====↓base.css↓====*/
#cont {
width: 610px;
height: 100%;
position: relative;
margin: 50px auto;
z-index: 70;
overflow: hidden;
}
#works_deta{
clear:both;
margin-top:100px;
margin-bottom:10px;
padding:20px;
background-color:#333535;
}
#works_deta h4,
#works_deta_right h5{
margin-bottom:10px;
}
#works_deta_left{
float:left;
}
#works_deta_right{
float:right;
width:390px;
}
#works_deta_right p{
color:#ffffff;
font-size: 85%;
line-height:1.8em;
}
hr#works_deta_right{
clear:both;
}
p.works_deta{
color:#ffffff;
font-size: 85%;
line-height:1.8em;
text-align:right;
clear:both;
}
#works_deta_right img.back_to_list{
float: right;
}
/*====↓iview.css↓====*/
/* The slider */
.iviewSlider {
overflow: hidden;
}
/* The timer in the Slider */
#iview-timer {
position: absolute;
z-index: 100;
border-radius: 5px;
cursor: pointer;
}
#iview-timer div {
border-radius: 3px;
}
/* The Preloader in the Slider */
#iview-preloader {
position: absolute;
z-index: 1000;
-webkit-border-radius: 3px;
-moz-border-radius: 3px;
border-radius: 3px;
border: #000 1px solid;
padding: 1px;
width: 100px;
height: 3px;
}
#iview-preloader div {
float: left;
-webkit-border-radius: 2px;
-moz-border-radius: 2px;
border-radius: 2px;
height: 3px;
background: #000;
width: 0px;
}
/* The strips and boxes in the Slider */
.iview-strip {
display:block;
position:absolute;
z-index:5;
}
.iview-block {
display:block;
position:absolute;
z-index:5;
}
/* Direction nav styles (e.g. Next & Prev) */
.iview-directionNav a {
position:absolute;
top:45%;
z-index:9;
cursor:pointer;
}
.iview-prevNav {
left:0px;
}
.iview-nextNav {
right:0px;
}
/* Control nav styles (e.g. 1,2,3...) */
.iview-controlNav {
position:absolute;
z-index:9;
}
.iview-controlNav a {
z-index:9;
cursor:pointer;
}
.iview-controlNav a.active {
font-weight:bold;
}
.iview-controlNav .iview-items ul {
list-style: none;
}
.iview-controlNav .iview-items ul li {
display: inline;
position: relative;
}
.iview-controlNav .iview-tooltip {
position: absolute;
}
/* The captions in the Slider */
.iview-caption {
position:absolute;
z-index:4;
overflow: hidden;
cursor: default;
}
/*====↓style.css↓====*/
.container {
display: block;
width: 600px;
margin: 0px auto;
}
#iview {
display: block;
width: 600px;
background: #000;
background: rgba(0, 0, 0, 0.7);
padding: 5px;
border-radius: 5px;
position: relative;
margin: 10px auto;
}
#iview .iviewSlider{
display: block;
width: 600px;
height: 360px;
overflow: hidden;
border-radius: 4px 4px 0px 0px;
}
.iview-controlNav {
position: static;
height: 45px;
text-align: center;
border-radius: 0px 0px 4px 4px;
}
.iview-controlNav .iview-items {
display: block;
padding: 0px 20px;
}
.iview-controlNav a img {
height: 60px;
border: #000 1px solid;
margin: 20px 10px 20px 0px;
border-radius: 2px;
}
.iview-controlNav a.active img {
border-color: #999;
}
#iview-preloader {
border: #666 1px solid;
width: 150px
}
#iview-preloader div {
background: #666;
}
お礼
この度は早い回答ありがとうございました。 全くご指摘の通りでした。 わかりにく説明でしたが、よくぞ解決策を導いてくださり、ありがとうございました。おかげさまで、疑問が解決しました。