How to display more than 2 image thumbnails inline?

[Bernard Lama]

Hi NCs,

Probably some NCs are hunting for the code that makes their image thumbnails smaller and greater in number inline on the main page. Two column layout has just 2 thumbnails inline but the below code can show more than 2 thumbnails. But I suggest you to use 3 thumbnails inline. Suggested width size: 200px

Steps: Copy and paste the following code into DESIGN STUDIO> CUSTOM CSS BOX. If you want to show more thumbnails, just play with width size.

Here is the code:

.column.span11 .grid-frame .matrix > .row > .span {
width: 200px;
}

If you are looking for someone to re-design your ning site, or any kind of ning help, directly contact me via my email id [e-mail]

This tip is based on 2 column layout. Please let me know if it does not work on other layouts.

Preview

[George H. Compton IV]

Great Tip Bernhard, it's working perfectly. I'm sure many NC's will use this code. :-)

[Bernard Lama]

Thanks George...I really appreciate what you have done for other NCs.

Cheers

[George H. Compton IV]

You're welcome Bernard, you know we all appreciate what you have done for everyone as well :-)

Cheers

[Dr. Krishna Kumari Challa]

All these days I used to wonder how to do this. Thanks for the tip. Keep them coming in!

[Bernard Lama]

You are welcome Khrishna Kumari. Glad it worked out for you.

[Bernard Lama]

Well Alex, the above code will affect only the main page. Perhaps, you can use the following code instead of above code to accomplish on photo page.

 

Here is the code

.column.span10 .matrix > .row > .span {
width: 300px;
}

[Bernard Lama]

Well Alex, the above code will affect only the main page. Perhaps, you can use the following code instead of above code to accomplish on photo page.

 

Here is the code

.column.span10 .matrix > .row > .span {
width: 300px;
}

[Bernard Lama]

Give this a try 

.column.span11 .matrix > .row > .span {
width: 200px;
}

[Bernard Lama]

Give this a try 

.column.span11 .matrix > .row > .span {
width: 200px;
}

[Bernard Lama]

Glad it worked out for you...

[Bernard Lama]

Glad it worked out for you...