Wed, 2012-10-10 06:07
testpg <---here is my testing page and i have intentionally set it to be in middle so it is obviously in wrong place so easier to see. It should be down the bottom below the photos just above the thin line but when I try and change the bottom from 50px to 0 it is still not below photo so I try -20px and it just hides itself behind the bottom line of the photos. I think because the photos and buttons are somehow all in the one slider and i cannot separate the two to position those buttons below. As well as that I don't know what is telling what how many of those buttons there should be let alone how to increase them and have them display corresponding photo. But first thing is first, is there a way to position those buttons down below the photo slides and lining up to left side of them down bottom?
here is the css
#page { width: 960px; margin: 0 auto; } #slider { position: relative; width: 680px; height: 540px; overflow: hidden; } #slider #controls a { margin: 0px 5px; display: block; width: 19px; height: 16px; float: left; background: url(<a href="http://www.charliesite.com/gs/images/slider-control.png" rel="nofollow">http://www.charliesite.com/gs/images/slider-control.png</a>); } #slider #controls a.active { background-position: 0 -16px; } #slider #controls { position: absolute; z-index: 9998; bottom: 50px; display: block; margin-left:0px; } #slider h2 { text-decoration: none; color: #6a6a6a; font: 22px/2em Arial, serif; margin-bottom: 10px; } #slider li { list-style: none; display: block; height: 520px; overflow: hidden; } #slider li > a { display: block; float: left; width: 100%; height: 100%; } #slider li > img.left-image-slider { max-height: 620px; } #slider li > div { float: right; width: 100%; height: 100%; margin-right: 2%; } #slider li > div p { font: 16px/1.5em Georgia, serif; line-height: 1.8em; } .clear { display: block; height: 0; line-height: 0; font-size: 0; clear: both; }
Wed, 2012-10-10 06:17
#1
Hi ldj, Remove
Hi ldj,
Remove position:relative; from #slider.
#controls is positioned absolute. any positioned element is positioned from the closest containing parent that is positioned or the body.
Wed, 2012-10-10 10:00
#2
changed some js code
Thanks Tony,
Initially I did try that but made no difference so I went into js file and changed that instead which did the trick.
Really appreciate your input.
Wed, 2012-10-10 10:02
#3
another thing
Maybe you could help with another thing on same page or someone else could have a look.
The centre content is not lining up exactly with the right side content at the top from below the header where the white meets the grey.
Wed, 2012-10-10 21:41
#4
It's the border-top on
It's the border-top on .nav
ul.nav { list-style: none; border-top: 1px solid #666;
Sat, 2012-10-13 06:45
#5
brilliant! thank you kindly
brilliant! thank you kindly Tony!
Sat, 2012-10-13 06:49
#6
search form
Can I also ask how I might get my search form just below sidebar last word "request." here
Sat, 2012-10-13 07:30
#7
you should modify the markup
you should modify the markup so it is in .sidebar1
Sun, 2012-10-14 08:03
#8
Thanks Tony I did try that
Thanks Tony I did try that but it will only go above the text but will work around it somehow.
I am now having different problem with my contact page which guess should make separate post because diff issue altogether.
Thanks again.