8 replies [Last post]
ldj
ldj's picture
Offline
Regular
Australia
Last seen: 9 years 28 weeks ago
Australia
Timezone: GMT+11
Joined: 2012-09-24
Posts: 17
Points: 21

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;
}

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 1 week 2 days ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5344
Points: 2965

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.

ldj
ldj's picture
Offline
Regular
Australia
Last seen: 9 years 28 weeks ago
Australia
Timezone: GMT+11
Joined: 2012-09-24
Posts: 17
Points: 21

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.

ldj
ldj's picture
Offline
Regular
Australia
Last seen: 9 years 28 weeks ago
Australia
Timezone: GMT+11
Joined: 2012-09-24
Posts: 17
Points: 21

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.

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 1 week 2 days ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5344
Points: 2965

It's the border-top on

It's the border-top on .nav

ul.nav {
list-style: none;
border-top: 1px solid #666;

ldj
ldj's picture
Offline
Regular
Australia
Last seen: 9 years 28 weeks ago
Australia
Timezone: GMT+11
Joined: 2012-09-24
Posts: 17
Points: 21

brilliant! thank you kindly

Laughing out loud brilliant! thank you kindly Tony!

ldj
ldj's picture
Offline
Regular
Australia
Last seen: 9 years 28 weeks ago
Australia
Timezone: GMT+11
Joined: 2012-09-24
Posts: 17
Points: 21

search form

Can I also ask how I might get my search form just below sidebar last word "request." here

Tony
Tony's picture
Offline
Moderator
Brisbane
Last seen: 1 week 2 days ago
Brisbane
Timezone: GMT+10
Joined: 2003-03-12
Posts: 5344
Points: 2965

you should modify the markup

you should modify the markup so it is in .sidebar1

ldj
ldj's picture
Offline
Regular
Australia
Last seen: 9 years 28 weeks ago
Australia
Timezone: GMT+11
Joined: 2012-09-24
Posts: 17
Points: 21

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.