PDA

View Full Version : Content Slider



Erika
02-16-2007, 04:54 PM
1) Script Title: Featured Content Slider

2) Script URL (on DD): http://www.dynamicdrive.com/dynamicindex17/featuredcontentslider.htm

3) Describe problem: Since I last posted this question I completely started over with a brand new page and deleted the files saved for the slider. I started all over with a new page and redid everything. You can see it at the www.iltenants.com (http://www.iltenants.com)

But, as you can see, for numbers (3) and (4) the page numbers go right through the content. I don't recall it doing this before. Where do I make the necessary change so that it is always below the content - wherever that may be? Please be specific because I am very much a newbie at codes. Oh, and apparently it only does this in mozilla firefox, not internet explorer.

Thank you very much for your help. I really appreciate it.

jscheuer1
02-16-2007, 05:07 PM
From contentslider.css (change in red):


.contentslide{
border: 10px white;
border-bottom-width: 6px;
padding: 8px;
width: 400px;
height: 450px;
}

You may wish to use a different value but, 450 seemed to allow enough room for things.

Also, doing it this way:


.contentslide{
border: 10px white;
border-bottom-width: 6px;
padding: 8px;
width: 400px;
height: 6px;
margin-top:20px;
}

.contentslide .contentdiv{
display: none;
}

.pagination{
width: 416px; /*Width of pagination DIV. To equal that of Content Slider's width, take into account the later's left/right paddings!*/
text-align: center;
background-color: #FFFFFF;
border: 10px solid white;
border-width: 0 10px; /*Left/ right border width of pagination DIV.*/
padding: 0 0 4px 0;
margin-top:-45px;
}

* html .pagination{ /*Simplified box model hack to get IE5 to display width equal to that of Content Slider's*/
width: 400px; /*IE5 width*/
w\idth: 416px; /*IE6 width*/
}

.pagination a{
padding: 0 5px;
text-decoration: none;
color: #2e6ab1;
background-color: white;
}

.pagination a:hover, .pagination a.selected{
color: #000080;
background-color: #E0E7FE;
}

Looked really good to me in the Firefox browser but, should be checked in other browsers before being used for your page.