Slider

[Mateo]

Hi

Iam struggling with my slider... I have 3 colum website and want the slider to fill 2 colum. I am using this slider: http://design.ning.com/profiles/blogs/adding-a-slider 

Maybe i am using the wrong slider?

regards Mateo 

[SweetPotato]

You'll also need to create a two column hero box
http://creators.ning.com/profiles/blogs/design-tricks-4-adding-a

SP

[Mateo]

Hi again...

Thank you so much for your help and fast reply.

I have benn strugling for hours now, trying to ajust the code in: /main/dashboard >> Advanced. And I can not make et looking "nice" and need like yours. See pic further down (spaces...)  Is it possible for you or other to copy/paste the code you are using for ajusting? 

Sorry for my english :-)

[Patrick Chappelle]

If you click the link SweetPotato provided, you will see the instructions and code to install your two column slider.

[Mateo]

Hi Patrick,

But then there wil be spaces etc. See my screenshot. And I have tried to ajust, but without luck. 

[Patrick Chappelle]

Hmm. I see. I'm sure someone will have an answer for you, I'm certain there is a resolution to this.

[Mateo]

sure... but not much help... patience patience patience 

[Mateo]

hmmm...

This is my css code. Maybe someone will copy/paste their code that are working?

-----

/*Slider */
#profile_slider {
height: 190px;
overflow:hidden;
margin-left: 6px;
margin-top: -10px;
background:#fff;
}

#profile_slider_inner {
width:100000px;
float:left;
}

#profile_slider .item {
float:left;
width: 741px;
margin:0;
position:relative;
}

#profile_slider .item img {
margin:0;
width: 741px !important;
max-width: 741px !important;
}

/* Slider Overlay Styles */

#profile_slider .item .overlay {
margin-top:30px;
padding:20px 14px 10px;
background:url(http://static.ning.com/design/images/60alpha.png) repeat scroll 0 0;
position:absolute;
bottom: 5px;
width:741px;
}

#profile_slider .item .overlay h3 {
font-size:24px;
line-height:4px;
float:left;
color:#fff;
width:741px;
}
#profile_slider .item .overlay p {
float:left;
color:#fff;
width:741px;
}
#profile_slider .item .overlay a {
color:#fff;
font-weight:bold;
text-decoration:underline;
}

/* Slider Navigation Buttons */

#slider_nav {
position:absolute;
bottom:30px;
right:20px;
}

#slider_nav .btn {
height:24px;
width:29px;
float:left;
background-color:#000;
margin-right:5px;
background-position:1px 2px;
background-repeat:no-repeat;
cursor:pointer;
-moz-border-radius: 4px; /* FF1+ */
-webkit-border-radius: 4px; /* Saf3+, Chrome */
border-radius: 4px; /* Opera 10.5, IE 9 */
border:1px solid #000000;
}

#slider_nav .btn:hover {
border:1px solid #3C78A7;
}

#slider_back {
background-image:url(http://static.ning.com/design/images/slider_back_btn.png);
}

#slider_fwd {
background-image:url(http://static.ning.com/design/images/slider_fwd_btn.png);
}

[Bernard Lama]

Use two ids for 2 different text boxes to adjust the height.

This goes to advanced CSS

#left_height{

height:220px;

}

#right_height{
height:220px;
}

Use this code in left text box:

<div id="left_height"></div>

Use this code is right text box:

<div id="right_height"> YOUR SLIDER CODE GOES HERE</div>

[Mateo]

not much help here.....

[Pahlavi R'AD]

Hello everyone, I followed the steps and everything worked perfectly. However, I did run into one problem. My slide doesn't show all the content. The pictures are there, but the text get's cut off for some reason. I have a 3 column lay out and I changed the width like was suggested, but I'm still having the same problem. Any help will be welcomed.

[Shesh Dhar Tiwari]

just edit the codes below picture box(corresponding to Activity....etc) and remove all <p></p> tags. the spaces below the picture will be gone.

[Pahlavi R'AD]

Thank you for your input. I still had no luck. This is what I'm getting http://test-60f517o50c7e8b8cfb22.ning.com/