I am trying to make my website design responsive but have a problem with positioning an image.
It appears too far to the right. My CSS code is;
body {
max-width: 100%;
margin: 0 auto;
background: none;
}
#container {width: 100%;}
.buttns {display: none;}
.menu {display: none;}
#container .slideshow {Position: absolute;
width: 100%;
border: none;
margin: auto;
top: 5%;
left: 2%;
bottom: 5%;
background: none;}
#container .slideshow li {position: absolute;
width: 85%;
height: auto;
border: none;
margin-left: 1%;
}
#container .slideshow img {width: 85%;
height: auto;
margin-left: 1%;
border-width: 4px;
border-style: inset;}
.slide-info {display: none;}
.cms-buttns {display: none;}
Also I am unable to shrink the background colour. Not sure if I need to raise a separate post for this.
I have attached a screen print so that you can see the problem.[ATTACH]15651[/ATTACH]
The large version works fine.
The attachments of this post were removed during the platform migration in 2018