Solved: Simple Icon positions

I made 5 different simple icon modules on my homepage, 4 of which have 4 images and 1 has only 1 image.

I chose Horizontal for all modules.

The issue is that I can't have them all centered, and I can't have more than 4 images on 1 row, although there is enough space on content area.

Will appreciate any help to resolve those issues.

Best regards.

11 Feb 11

Hi aalfouzan,

It looks like we helped you with some custom Ninja Simple Icon Menu styling in the past, and that CSS remains in your template.css file.

In order to make the module work again, look for the following CSS declarations at the bottom of your template.css file, and comment them out by adding /* and */ tags around them as I have done here:



/*

.nsi-iconvert ul {

    padding-left: 45px;

    right: 0;

}

*/

/*

div.nsi-container div ul li {

    -moz-background-clip: border;

    -moz-background-origin: padding;

    -moz-background-size: auto auto;

    background-attachment: scroll;

    background-color: transparent;

    background-image: none;

    background-position: 0 0;

    background-repeat: repeat;

}

*/

/*

.nsi-container ul {

    position: relative;

    right: -15px;

}

*/

/*

.nsi-container div {

    float: none;

    left: 50%;

    margin-left: -250px;

    margin-right: auto;

    position: relative;

    text-align: center;

    width: 500px;

}

*/

11 Feb 11

Thank you very much Mark. I can now have more than 4 images on a row, but for the 1 image module, which I called Login, the image went all the way right, not centered.

Best regards.
Ammar

11 Feb 11

Hi Ammar,

That last module is showing the icon in a vertical orientation. Please try setting it to horizontal and see if that fixes the issue.

Cheers,
Mark

11 Feb 11

Thumb up Mark. It did work very well with horizontal setting.

Many thanks.

11 Feb 11

Glad to hear it :)

Have a good weekend!

11 Feb 11

Thanks Mark. You too, have a super wonderful Ninja weekend :)

20 Mar 11

Hi Mark,

I can't seem to find the css file with the "nsi-container" details so I can align the icons to the right (for Ninja Simple Icon Menu). Any chance you could steer me as to where I can find where I can alter the css?

thanks so much,

Nick

20 Mar 11

Hi Nick,

You shouldn't need to edit CSS in order to align icons to the right. Can I see your website?.. there might be something else going on.

In any case, the CSS files should be in the media directory:

/media/mod_ninja_simple_icon_menu

Hope that helps.

Kind regards,
Mark